webpack - webpack 中的当前文件路径

Question

有什么方法可以接收当前文件路径，比如在 requirejs 中？

define(['module'], function (module) {
    console.log(module.uri)
});

Answer 1

是的，有一个：__filename。

但是默认情况下 webpack 不会泄露路径信息，你需要设置一个配置标志来获取真实的文件名而不是一个 mock ( "/index.js")。

// /home/project/webpack.config.js
module.exports = {
  context: __dirname,
  node: {
    __filename: true
  }
}

您可以使用__filename获取相对于context选项的当前文件名：

// in /home/project/dir/file.js
console.log(__filename);
// => logs "dir/file.js"

文件名仅嵌入到__filename使用的模块中。因此，您不必担心路径会从其他模块泄漏。

Answer 2

为了获取文件名和目录名，我将其添加到 web pack 配置中

node : {
   __filename: true,
   __dirname: true,
},

将上下文设置为 __dirname 搞砸了我的 webpack 配置，因为我的 webpackconfig 没有放在 root 中，但是路径是这样设置的

Answer 3

尝试webpack.DefinePlugin使用webpack.DefinePlugin.runtimeValue. 它给出了实常数，可以在 ES6import和require().

网络包配置：

new webpack.DefinePlugin({
    __NAME: webpack.DefinePlugin.runtimeValue(
        v => {
            const res = v.module.rawRequest.substr(2)
            return JSON.stringify(res); // Strings need to be wrapped in quotes
        }, []
    )
})

// OR

new webpack.DefinePlugin(
    __NAME: webpack.DefinePlugin.runtimeValue(
        v => {
            const res = v.module.rawRequest.substr(2)
            return `'${res.substr(0, res.lastIndexOf('.'))}'`
        }, []
    )
})

源文件：

// require "<filename>.html" from "<filename>.js"
const html = require(`./${__NAME}.html`)