zoukankan      html  css  js  c++  java
  • webpack中devtool的配置方案[开发模式]---[线上模式]

    // 开发模式下
    module.exports = {
      mode: 'development',
      devtool: 'cheap-module-eval-source-map'       
    }
    // 线上模式下
    module.exports = {
      mode: 'production',
      devtool: 'cheap-module-source-map'       
    }

     权威介绍请查看官方文档:https://webpack.js.org/configuration/devtool/

    -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

    devtool: 'source-map'

    能提示错误在源文件的具体位置。打包后会在output配置的路径[比如说dist目录]下,

    生成一个`源文件`和`打包后的文件`的映射关系文件[xxx.map.js]。

    ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

    devtool: 'inline-source-map'

    功能和source-map一样,不会生成映射关系文件,而是将映射关系写到了出口文件中[比如说main.js]

    ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

    devtool: 'cheap-source-map'

    没有加cheap时,会提示哪一行的哪一列发生了错误[二维坐标(x,y)];

    加了cheap后提示哪一行发生了错误[一维坐标 (x)]。如果引入的第三方模块发生错误,此时也不会提示。

    --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

    devtool: 'cheap-module-source-map'

    会同时提示业务文件和第三方文件发生的错误

    -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

    devtool: 'eval'

    能对一些简单的错误,快速的做出提示。但是对一些复杂的错误,给出的提示信息很模糊。

  • 相关阅读:
    git pull 的时候 把本地的修改 覆盖远程端
    git 把其他分支上的文件拿来覆盖本地
    JS高德地图计算两地之间的实际距离
    C# 微信开发-----微信会员卡(三)激活会员卡
    C# 微信开发-----微信会员卡(二)
    Jquery点击div之外的地方隐藏当前div
    css好看的银行卡号样式
    C# 微信开发-----微信会员卡(一)
    Js操作Array数组
    好看的404代码
  • 原文地址:https://www.cnblogs.com/ladybug7/p/12321254.html
Copyright © 2011-2022 走看看