将变量注入 webpack

Injecting variables into webpack

本文关键字：webpack 注入 变量      更新时间：2023-09-26

我正在尝试将一个变量注入到我的 webpack 捆绑包中的每个模块中，以便为每个文件的 JS 错误提供调试信息。 我已启用

node: {
   __filename: true
}

webpack 中的当前文件路径

在我的 webpack.config 中，但我想注入类似的东西

var filename = 'My filename is: ' + __filename;

在编译之前放入每个模块中。 我已经看到了带有raw选项的横幅插件，但这似乎只会在 webpack 闭包之外注入横幅，而不是我想要将脚本注入每个模块的结果。

我使用变量来解析webpack.config.js文件中的几个变量：

plugins: [
    new webpack.DefinePlugin({
      ENVIRONMENT: JSON.stringify(process.env.NODE_ENV || 'development'),
      VERSION: JSON.stringify(require('./package.json').version)
    })
]

它可能不够动态，但如果是，那么您可能能够绕过该加载程序解决方案。

编写自己的加载器：

my_project/my_loaders/文件名加载器.js： 

module.exports = function(source) {
  var injection = 'var __filename = "' + this.resourcePath + '";'n';
  return injection + source;
};

将其添加到管道，并确保同时添加配置：

resolveLoader: {
  modulesDirectories: ["my_loaders", "node_modules"]
}

请参阅有关如何编写加载程序的文档。

相关文章：