我正在尝试在我的 React 应用程序中使用 Webpack(和 html-webpack-plugin)向我的index.html文件添加一个元标记。 const ogImage = require('./src/assets/images/og_image.png'); // ...later ...
提示:本站收集StackOverFlow近2千万问答,支持中英文搜索,鼠标放在语句上弹窗显示对应的参考中文或英文, 本站还提供 中文繁体 英文版本 中英对照 版本,有任何建议请联系yoyou2525@163.com。
我总是在webpack.config.js
中使用require
调用来为我的构建工作流导入库。 但是,最近我在一个使用import
的项目上工作。
一般来说,它工作正常,但似乎一些导入webpack.config.js
的支持工具在其中使用导入时无法import
它并出现错误:
不能在模块外使用
import
语句。
作为试用,我将配置更改为通过 babel 运行,它可以工作,但对我来说,使用旧的require
和官方文档仍然可以使用它。
我应该回滚import
以避免警告,或者如果我通过 babel 传递它并重命名为webpack.config.babel.js
,我可以毫无问题地使用它们?
经过一番研究,我找到了一个解决方案 - 在将 webpack 配置传递给我使用的库(eslint-import-resolver-webpack)之前,它无法加载它。
所以,我不直接加载webpack.config.js
,而是通过 babel 转译器:
const webpackConfigTranspiled = babel.transformFileSync(
path.resolve(__dirname, './webpack.config.js'),
).code;
然后将转译的内容传递给库/工具:
settings: {
'import/resolver': {
webpack: webpackConfigTranspiled,
},
'css-modules': {
basePath: 'src',
},
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.