Webpack 编译但 webpack-dev-server 没有相同的配置

Posted

技术标签:

【中文标题】Webpack 编译但 webpack-dev-server 没有相同的配置【英文标题】:Webpack compiles but webpack-dev-server does not with same config 【发布时间】:2016-07-01 00:33:01 【问题描述】:

我开始学习 webpack 并尝试使用 webpack-dev-server 进行编译和浏览器重新加载。

我在运行命令时遇到了一个问题:

webpack

我的文件编译正常,但是当我使用命令时:

# I removed the "--hot" and "--inline" to try to isolate where the problem 
# was coming from.

webpack-dev-server --config webpack.config.js

命令终端中的输出看起来不错,但实际上没有编译:

问题是,webpack-dev-server 确实成功地提供了public 目录中的文件,所以这部分工作正常,只是没有编译 javascript 和 vue 文件。

这是我的webpack.config.js

module.exports = 
    entry: './src/index.js',
    output: 
        path: __dirname + '/public',
        publicPath: '/public',
        filename: 'bundle.js'
    ,
    devtool: 'source-map',
    devServer:
        contentBase: __dirname + '/public'
    ,
    module:
        loaders:[
             test: /\.vue$/, loader: 'vue'
        ]
    
;

我一直在关注描述该过程的vue-loader start tutorial,我没有发现任何问题。

我知道我指定了一个与教程不同的内容目录,但据我所知,这不会影响文件的编译。

我在这里错过了什么?

【问题讨论】:

【参考方案1】:

这是因为 Webpack-dev-server 从内存而不是磁盘提供文件。 文档中的确切引用,https://webpack.github.io/docs/webpack-dev-server.html

这个修改过的包是从内存中的相对路径提供的 在 publicPath 中指定(参见 API)。它不会被写入您的 配置的输出目录。捆绑已经同时存在的地方 内存中捆绑包的 url 路径将优先(默认情况下)。

【讨论】:

啊,好吧,我记得你提到它了。所以这意味着我遇到的整体问题有点不同。我会更新我的问题。 实际上,总体问题已经不同,我要创建一个新帖子。你回答了我最初提出的问题,所以这篇文章没有更多内容了。 你找到答案了吗?

以上是关于Webpack 编译但 webpack-dev-server 没有相同的配置的主要内容,如果未能解决你的问题,请参考以下文章

轻松理解webpack热更新原理

如何让 webpack 和 iis express 协同工作?

webpack-dev-server 不监视我的文件更改

Webpack 编译但 webpack-dev-server 没有相同的配置

将数据从 Node 传递到 Vuejs

Webpack:热重载不起作用,但更改编译