首页 > 解决方案 > Webpack 服务不使用 webpack.config.js 中的路径

问题描述

试图理解 Webpack

webpack --版本

网络包 5.39.1

webpack-cli 4.7.2

webpack-dev-server 3.11.2

我知道 webpack-dev-server 不喜欢 webpack 5。所以我不想玩版本,而是想使用 webpack serve。

webpack.config.js:

const path = require('path');
module.exports = {
    entry: "./app.js",
    mode: 'development',
    output: {
        path: path.resolve(__dirname, "dist"),
        filename: "bundle.js"
    },
}

如果我运行 webpack 它会生成 dist\bundle.js

如果我运行 webpack serve 它从根目录而不是路径提供 bundle.js。所以我的 HTML 文件找不到它。有什么我想念的想法吗?

应用程序.js:

document.write("Hello");
console.log('App loaded');

索引.html:

<html>
    <body>
        <script src="dist/bundle.js"></script>
    </body>
</html>

编辑,添加控制台日志。

webpack serve
i 「wds」: Project is running at http://localhost:8080/
i 「wds」: webpack output is served from /
i 「wds」: Content not from webpack is served from D:\ProgrammingProjects\Webpack\2-webpack-config
i 「wdm」: asset bundle.js 376 KiB [emitted] (name: main)
runtime modules 432 bytes 3 modules
modules by path C:/...AppData/Roaming/npm/node_modules/webpack-dev-server/ 320 KiB
  modules by path C:/...AppData/Roaming/npm/node_modules/webpack-dev-server/node_modules/ 299 KiB 11 modules
  modules by path C:/...AppData/Roaming/npm/node_modules/webpack-dev-server/client/ 20.9 KiB
    modules by path C:/...AppData/Roaming/npm/node_modules/webpack-dev-server/client/utils/*.js 6.48 KiB 5 modules
    modules by path C:/...AppData/Roaming/npm/node_modules/webpack-dev-server/client/*.js 9.33 KiB 3 modules
    modules by path C:/...AppData/Roaming/npm/node_modules/webpack-dev-server/client/clients/*.js 5.11 KiB 2 modules
modules by path C:/...AppData/Roaming/npm/node_modules/webpack/ 16.1 KiB
  modules by path C:/...AppData/Roaming/npm/node_modules/webpack/hot/*.js 1.42 KiB
    C:\...AppData\Roaming\npm\node_modules\webpack\hot\emitter.js 75 bytes [built] [code generated]
    C:\...AppData\Roaming\npm\node_modules\webpack\hot\log.js 1.34 KiB [built] [code generated]
  C:\...AppData\Roaming\npm\node_modules\webpack\hot/ sync nonrecursive ^\.\/log$ 170 bytes [built] [code generated]
  C:\...AppData\Roaming\npm\node_modules\webpack\node_modules\events\events.js 14.5 KiB [built] [code generated]
./app.js 128 bytes [built] [code generated]
webpack 5.39.1 compiled successfully in 560 ms
i 「wdm」: Compiled successfully.

标签: javascriptnode.jswebpack

解决方案


推荐阅读