我正在使用Babel(没有Webpack)来翻译一些ES6代码。代码包含一个模板文字,我想在构建时对其进行评估。
代码包含以下导入,我想在其中注入版本:
const Component = React.lazy(() => import(`projectVersion${__VERSION__}/FooBar`))
我已经使用了许多不同的插件来尝试和实现这一点,如babel-plugin-inline-replace-variables
,babel-plugin-transform-inline-environment-variables
,但代码编译成这样:
var Component = /*#__PURE__*/_react.default.lazy(function () {
return Promise.resolve("projectVersion".concat("1", "/FooBar")).then(function (s) {
return _interopRequireWildcard(require(s));
});
});
但我所追求的是沿着这样的东西(就好像我只是手动将版本添加到projectVersion
):
const Component = /* #__PURE__*/_react.default.lazy(() => Promise.resolve().then(() => _interopRequireWildcard(require('projectVersion1/FooBar'))))
其中一个原因是,当使用concat
运行代码时,我得到错误Critical dependency: the request of a dependency is an expression
。
提前感谢您的帮助和建议。
详细信息
命令:babel src --out-dir build
巴别塔配置:
module.exports = api => {
api.cache(true)
return {
presets: [
['@babel/preset-env', {
corejs: 3,
targets: '> 0.25%, not dead',
useBuiltIns: 'usage',
}],
['@babel/preset-react', {
runtime: 'automatic',
}],
'@babel/preset-typescript',
],
plugins: [],
}
}
1条答案
按热度按时间zy1mlcev1#
在尝试了许多不同的潜在解决方案后,我最终决定编写一个自定义的Babel插件,用
StringLiteral
替换TemplateLiteral
。下面的代码写得很慢,是针对我的用例的,但希望它能帮助到别人。如果我有时间,我会让它更健壮,更可重用,并在npm上分享。
使用插件就像将其添加到Babel插件中一样简单: