如何解决如何你可以在 Webpack 编译钩子中操作 AST 吗?
对于一些内部工具,我正在尝试使用 webpack 将源文件名写入 javascript 源。我想出了下面的代码。不幸的是,虽然它确实替换了提供的 AST 中的 '[filename]',但该更改似乎被丢弃了。在这种情况下 AST 是只读的吗? (而且可能,如果不是这样,你怎么能做到这一点?)
const NAME = 'InjectFilenamePlugin'
const SOURCE_TEST = /src/i // a path to ensure node_modules are bypassed
const PLACEHOLDER = '[filename]'
class InjectFilenamePlugin {
apply(compiler) {
compiler.hooks.compilation.tap(NAME,(_,params) => {
const { normalModuleFactory } = params
function handler(parser) {
parser.hooks.program.tap(NAME,(ast) => {
const { resource } = parser.state.module
if (SOURCE_TEST.test(resource) && ast) {
replacePlaceholder(ast)
}
function replacePlaceholder(node) {
if (node.value === PLACEHOLDER) {
node.value = resource
node.raw = `"${resource}"`
} else {
Object.values(node)
.filter(node => node && typeof node === 'object')
.forEach(replacePlaceholder)
}
}
})
}
normalModuleFactory.hooks.parser
.for('javascript/auto')
.tap(NAME,handler)
normalModuleFactory.hooks.parser
.for('javascript/dynamic')
.tap(NAME,handler)
normalModuleFactory.hooks.parser
.for('javascript/esm')
.tap(NAME,handler)
})
}
}
module.exports = InjectFilenamePlugin
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。