webpack 4：没有找到bundle js
我最近升级到了Webpack4。页面正在成功加载，无论何时发生更改，它都会使用webpack dev server自动刷新页面。它做得很好，但在控制台中显示以下错误
GEThttp://localhost:8090/build/bundle.js404（未找到）
有些时候，当URL中有id时，它会将id附加到捆绑js url中，如下所示
http://localhost:8090/16/build/bundle.js
我用堆栈溢出答案和GitHub解决方案尝试了许多方法，但都不适合我。以下是模块细节
"webpack"："^4.15.0"，"webpack-cli"："^3.0.8"，"webpack-dev-server"："^3.1.4"，"Babel-core"："^6.26.3"，"Babel-loader"："^7.1.5"，"Babel-plugin-transver-class-属性"："^6.24.1"，"Babel-plugin-transver-Object-rest-传播"："^6.26.0"，"Babel-polill"："^6.26.0"，"Babel-preet-env"："^1.7.0"，"Babel-preet-react"："^6.24.1"
webpack.config.js：
const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const CompressionPlugin = require("compression-webpack-plugin");
const webpack = require('webpack');
module.exports = {
target: "web",
entry: [
"whatwg-fetch",
'webpack-dev-server/client?http://localhost:8090',
'webpack/hot/only-dev-server',
'babel-polyfill',
"./src/index.js"
],
output: {
path: path.resolve(__dirname, "build"),
filename: "bundle.js",
publicPath: "/"
//make sure port 8090 is used when launching webpack-dev-server
},
plugins: [new HtmlWebpackPlugin({
template: "index.html"
}),
new CompressionPlugin({
asset: "[path].gz[query]",
algorithm: "gzip",
test: /\.js$|\.jsx$|\.css$|\.html$/,
threshold: 10240,
minRatio: 0.8
}),
new webpack.HotModuleReplacementPlugin(),
// enable HMR globally
new webpack.NoEmitOnErrorsPlugin(),
new webpack.ProvidePlugin({
jQuery: 'jquery',
$: 'jquery',
jquery: 'jquery'
})
],
module: {
rules: [
{
//tell webpack to use jsx-loader for all *.jsx files
test: /\.(js|jsx)$/,
exclude: /node_modules/,
loader: "babel-loader"
},
{
test: /\.css$/,
loader: "style-loader!css-loader"
},
{
test: /\.(png|jpg|jpeg|gif|woff|woff2|svg)$/,
loader: 'url-loader?limit=100000'
},
{
test: /\.(eot|ttf)$/,
loader: "file-loader"
},
{
test: /\.html$/,
exclude: /node_modules/,
loader: 'html-loader'
},
{
test: /\.scss$/,
loaders: ["style-loader", "css-loader", "sass-loader"]
}
]
},
resolve: {
modules: [
path.resolve("./src"),
path.resolve("./node_modules")
],
extensions: [".js", ".jsx"]
},
devServer: {
watchOptions: {
// Needed for Windows Subsystem for Linux dev environment:
poll: true
},
contentBase: "/build"
},
devtool: "cheap-module-eval-source-map",
node: {
child_process : "empty",
fs: "empty"
}
};
My index.html位于根目录中
index.html
<html>
<head>
<link href="https://fonts.googleapis.com/css?family=Cabin+Sketch" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<div id="App">
<!-- this is where the root react component will get rendered -->
</div>
<script type="text/javascript" src="./build/bundle.js"></script></body>
</html>
共有1个答案
在浏览了所有与此问题相关的github答案后，我找到了答案。我最终在我的index.html中解决了这个问题
问题主要是在index.html中指向bundle js。找不到webpack bundle.js的原因是我在index.html中指定了错误的路径。
下面的一个解决了我的问题。
<script src="/bundle.js"></script>
-
我正在使用安装在本地主机上的wordpress构建一个站点。 出于某种原因，我的post.php页面没有显示帖子缩略图（特色图片）。我已经确定，这是一个问题，timthumb.php这是不正确的定位图像网址。我在网上搜索了几个小时，尝试了许多解决方案，但似乎没有任何效果。 基本问题是我在blog.php文件中的这一行： My functions.php脚本将get_image_url定义如下： 在
-
问题内容： 我正在使用gradlew进行Java项目。我使用Ubuntu Linux作为操作系统。当我运行“ gradle”时，它将运行并提供信息。但是，当我运行“ gradlew”时，其输出为“未找到命令’gradlew’，您的意思是：软件包’gradle’（universe）gradlew中的命令’gradle’：未找到命令” 我做了研究，有了jdk，并且做了sudo apt-get inst
-
我在使用coroutine时遇到了这个问题，你能告诉我为什么我会得到这个错误吗 实现'org.jetbrains.kotlinx:kotlinx-coroutines-core:1.0.1‘实现'org.jetbrains.kotlinx:kotlinx-coroutines-Android:1.0.1' kotlin版本是:ext.kotlin_version='1.3.10'
-
我试图使用以下命令将文件部署到远程存储库： 我收到了这个错误消息： 在当前项目和插件组[org.apache.maven.plugins，org.codehaus.mojo]中找不到前缀“–Durl=http”的插件，这些插件可从中央存储库[local（/Users/ssurendran/.m2/repository]获得(https://repo.maven.apache.org/maven2)
-
我正在导入Apache Commons Math和Lemmingapex Trilateration作为处理中的外部jar库。我遵循SO的指示： 如何在处理中添加外部库 处理草图似乎工作正常，但每次运行草图时，我都会将以下错误打印到控制台。 这是处理PDE草图： 我哪里错了？有什么建议吗？