如何在Nuxt 2生产构建中禁用Source Map？

1. 禁用项目自身的Source Map #

在项目根目录的nuxt.config.js文件中，找到build配置项，添加或修改sourceMap为false，这会禁用生产环境下项目自身代码的Source Map生成：

export default {
  build: {
    sourceMap: false
  }
}

2. 处理第三方依赖的Source Map #

你提到的adminlte.min.js和bootstrap.min.js属于第三方依赖，它们的Source Map可能是打包时被自动引入的，可通过以下两种方式处理：

• 手动移除依赖包中的Source Map文件
  找到项目node_modules中对应依赖的目录（比如node_modules/adminlte/dist/js、node_modules/bootstrap/dist/js），删除其中的.map后缀文件（如adminlte.min.js.map、bootstrap.min.js.map），之后重新打包部署。
• 通过Nuxt配置过滤第三方Source Map
  在nuxt.config.js的build配置中，使用extend方法修改webpack配置，阻止第三方Source Map被输出：

export default {
  build: {
    sourceMap: false,
    extend(config, { isDev, isClient }) {
      if (!isDev && isClient) {
        // 禁用第三方库的Source Map
        config.module.rules.forEach(rule => {
          if (rule.test.toString().includes('js')) {
            rule.use.forEach(use => {
              if (use.loader === 'babel-loader') {
                use.options.sourceMap = false
              }
            })
          }
        })
        // 或者直接修改devtool，彻底禁用所有Source Map
        config.devtool = false
      }
    }
  }
}

注意事项 #

• 修改配置后，需重新执行npm run build（或yarn build）生成生产环境包再部署。
• 如果是通过CDN引入的第三方库，要确保CDN提供的是不带Source Map的版本，或手动去掉引入代码中对应的.map关联。

内容的提问来源于stack exchange，提问作者Zhuldyz Namazbayeva