Webpack高级用法

Question

我最近一直在探索webpack，我遇到了一些我无法理解的事情。我试图找到很多答案，但无法得到正确的答案。所以这是我的怀疑：

1. 我们何时使用webpack-dev-server？是某种运行我的express代码的服务器，如果是，那么它与运行普通express服务器有何不同。

2. 如何在运行webpack --watch时调试服务器端代码。

3. 我正在浏览某人的git repo，我发现了这段代码：

   export default(DEBUG, PATH, PORT=9000) => ({ entry: (DEBUG ? [ 'webpack-dev-server/client?http://localhots:9000', 'webpack/hot/dev-server' ] : []). concat([ '.src/theme/theme.less', 'babel/polyfill', 'whatwg-fetch', './src/main' ]), output: { // some output path was given here. }, cache: DEBUG, debug: DEBUG, devtool: DEBUG && "eval-source-map", // some other modules and loaders were here. plugins: DEBUG ? [ new webpack.HotModuleReplacementPlugin(), new webpack.NoErrorsPlugin() ] : [ new webpack.DefinePlugin({'process.env.NODE_ENV': '"production"'}), new ExtractTextPlugin("style.css", {allChunks: false}), new webpack.optimize.DedupePlugin(), new webpack.optimize.UglifyJsPlugin({ compressor: {screw_ie8: true, keep_fnames: true, warnings: false}, mangle: {screw_ie8: true, keep_fnames: true} }), new webpack.optimize.OccurenceOrderPlugin(), new webpack.optimize.AggressiveMergingPlugin() ] })

   • 我无法理解entry。
   到底发生了什么
   • 这是什么DEBUG，几乎在所有地方都在使用。

Answer 1

  

我们什么时候使用webpack-dev-server？它是某种运行我的快速代码的服务器，如果是，那么它与运行普通快速服务器有什么不同。

您可以使用webpack-dev-middleware在Express之上构建类似的内容。这就是webpack-dev-server毕竟使用的东西。还有像代理，html5历史回退和捆绑这样的细节。 webpack-dev-server只是为了方便。

  

如何在运行webpack --watch

时调试服务器端代码

我希望您可以使用Node debugger或node-inspector。

  

我正在浏览某人的git repo并且我遇到了这段代码：...

看起来作者正在使用DEBUG来控制配置，以便为调试（开发）使用启用HMR和调试相关位。在制作期间，这些被跳过。除非您以内联模式运行它，否则webpack-dev-server需要entry部分。

还有其他可能更简洁的方法来达到相同的效果。