const path = require( path );module.exports = {entry: ./src/index.js ,output: {filename: bundle.js ,path: path.resolve(__dirname, dist ) },devtool: "source-map"};复制代码devtool有20 多种不同取值,分别生成不同类型的Source Map,可以根据需要进行配置。下文会详细介绍,这里不再赘述。3.6 C...
eval:生成每个模块的eval代码,并且模块执行完后,eval代码被执行。这种方式速度很快,但是不适合生产环境。 source-map:生成独立的source-map文件,适合生产环境,但是会增加构建时间和文件大小。 cheap-source-map:生成source-map,但是不包含列信息,适合大型项目。 cheap-module-source-map:生成source-map,同时会将loader的...
--source-mapSourceMap的文件的路径和名称--source-map-root源文件的路径--source-map-url//#sourceMappingURL的路径。 默认为--source-map指定的值。--source-map-include-sources是否将源代码的内容添加到sourcesContent数组--source-map-inline是否将SourceMap写到压缩代码的最后一行--in-source-map输入SourceMap,当...
--source - map - url//#sourceMappingURL的路径。 默认为--source-map指定的值。 --source - map - include - sources 是否将源代码的内容添加到sourcesContent数组 --source - map - inline 是否将SourceMap写到压缩代码的最后一行 --in-source - map 输入SourceMap, 当源文件已经经过变换时使用 复制代码 ...
eval-source-map 使用eval打包源文件模块,在同一个文件中生成干净的完整的source map。不影响构建速度,对打包后输出的js文件的执行具有性能和安全的隐患。是开发阶段的一个非常好的选项,生产阶段一定不要用; cheap-module-eval-source-map 这是在打包文件时最快的生成source map的方法,没有列映射,和eval-source-...
1.使用source-map提示截图 生产单独映射文件 报错提示 报错代码查看 2. 使用eval-source-map提示截图 不会产生单独文件 3.使用cheap-module-source-map截图 产生单独文件 不显示列 4.使用cheap-module-eval-source-map 不产生单独文件和列 集成打包后文件 警告 home.js超过244KiB 可能会影响web性能。
(false | eval | [inline-|hidden-|eval-][nosources-][cheap-[module-]]source-map)....
这里就指向了源代码的报错位置,更利于开发的修改。source-map 打包之后会生成一个.map文件,是打包文件与源文件的映射文件。 1.1.3 配置开发环境 代码语言:javascript 复制 mode:'development',devtool:'cheap-module-eval-source-map',// 开发环境 优点:有错误代码提示 打包速度较快 ...
cheap-module-eval-source-map绝大多数情况下都会是最好的选择,这也是下版本 webpack 的默认选项。 相关解释: 大部分情况我们调试并不关心列信息,而且就算 sourcemap 没有列,有些浏览器引擎(例如 v8) 也会给出列信息,所以我们使用 cheap 模式可以大幅提高 souremap 生成的效率。
webpack中可以在devtool中设置, 在开发环境中可以配置devtool为cheap-module-source-map,方便调试。生产环境下建议采用none的方式,这样做不暴露源代码。或者是nosources-source-map 的方式,既可以定位源代码位置,又不暴露源代码。 let path = require("path") ...