Chrome开发人员工具中的Webpack 3.5.5调试显示了两个源文件.一个在webpack://和其他webpack-internal下://

Question

迁移现有的webpack项目以使用webpack 3.5.5及其新配置.使用express server而不是webpack-dev-server.我必须在webpack中设置解决方案,如下所示.

const resolve = {
    extensions : ['.js'],
    modules : [
        'node_modules',
        'src',
        'testApplication'
    ]
};

当我使用chrome开发人员工具调试这个webpack应用程序时,我可以看到2个版本的源文件.

1. webpack下的第一个://它与源完全匹配
2. webpack-internal下的第二个://这个是源代码的babel编译版本.

我的问题是

1. 有什么地方我只得到文件的第一个版本而不是两个？
2. 我认为node_modules应该被隐式定义为一个模块,而不是我在解析时明确地指定它,是否有一些我可以使构建工作没有在resolve中定义node_modules.
3. 在使用与webpack 3.5.5相同的源代码(从webpack 1.14.0迁移它)之后,快速服务器启动似乎已经减慢了节点.我的猜测是,在解析下的模块中指定了node_modules会导致它.有任何想法吗？

Answer 1

1. 您可以使用 Webpack 的属性来配置源映射devtool。你想要的是devtool: 'source-map'（来源）。这只会向您显示 下的原始源代码webpack://。请注意，还有其他选项可能更适合您的用例。

2. ["node_modules"]是 的默认值resolve.modules。但是，如果您指定则resolve.modules需要包含"node_modules"在数组中。（来源）。您在 中指定"src"and似乎很奇怪。如果您有本地源文件，您应该使用相对路径（例如. 这应该可以在没有"testApplication"resolve.modulesrequire("./local_module")srcresolve.modules

3. 指定node_modulesinresolve.modules不会导致任何速度减慢（参见 2.）。速度变慢的可能原因有很多。例如，也许您错误地将 babel 应用于整个node_modules文件夹？