create-react-app这个使用create-react-apptypescript创建的 react 项目将用于显示一些自定义组件，以便在其他项目中重复使用。我的目标是让组件在使用它的代码旁边使用。
如果我无权访问 webpack 配置并且无法使用，我该如何加载文件fs.readFile？
环顾四周后，我设法使这项工作正常进行。有两个主要部分必须到位才能使其工作。
在这种情况下，我想使用raw-loader，所以我将它安装为开发依赖项。yarn add -D raw-loader.
为了实际导入文件，我需要像这样覆盖 webpack 配置：
// eslint-disable-next-line import/no-webpack-loader-syntax
import toolbarItems from '!!raw-loader!../ToolbarItems';
这会将整个文件加载到变量 toolbarItems 中。通过!!在加载器之前使用 ，我可以防止任何其他 webpack 加载器在这种特定情况下处理它。这可能在普通的 javascript 项目中单独工作，但在打字稿中......
我遇到了打字稿错误：
Failed to compile.
/Users/cory/Code/something/custom-theme/src/pages/NavigationDemo.tsx
TypeScript error in /Users/cory/Code/something/custom-theme/src/pages/NavigationDemo.tsx(9,26):
Cannot find module '!!raw-loader!../ToolbarItems'. TS2307
7 |
8 | // eslint-disable-next-line import/no-webpack-loader-syntax
> 9 | import toolbarItems from '!!raw-loader!../ToolbarItems';
| ^
10 |
11 | const useStyles = makeStyles({
12 | root: {
只需在一个名为的文件中为加载程序声明一个模块就ToolbarItems.ts.d.ts解决了我的问题：
declare module '!raw-loader!*' {
const content: string;
export default content;
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句