reactjs - 未找到模块(Typescript 和 baseUrl 选项)
问题描述
我正在尝试在我的 typescript 项目中使用自定义路径,问题是 webpack 无法识别我的模块,这给了我“webpackMissingModule”错误。
我尝试了不同的解决方案,但对我没有任何效果。建议?想法?
一些包
"react": "^16.8.4",
"react-dom": "^16.8.4",
"typescript": "3.3.1",
tsconfig.json
{
"compilerOptions": {
"target": "es5",
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "preserve"
},
"include": ["./src"],
"exclude": ["node_modules", "build"],
"extends": "./paths.json"
}
路径.json
{
"compilerOptions": {
"baseUrl": "./src",
"paths": {
"@src/*": ["*"],
"@components/*": ["components/*"]
}
}
}
.env
NODE_PATH=./
零件
import React from "react";
import Hello from "@components/Hello";
const Home = () => (
<div>
<h1>Home</h1>
<Hello />
</div>
);
export default Home;
解决方案
好吧,我发现了一些对我有用的东西,它叫做 tsconfig-paths-webpack-plugin。您需要做的就是将它导入到您的 webpack 配置中,与 tsconfig.json 连接,仅此而已。
推荐阅读
- node.js - sequelize count 不适用于嵌套对象
- perl - Windows 10 上的草莓 perl 在当前目录中找不到模块
- scilab - 在 scilab 中使用 fsolve 时如何克服“scilab 参数函数返回的变量不正确”?
- python - 部署到 Google App Engine Flexible 时 Python 相对路径出现问题
- c++ - 在大数组大小的情况下出现段错误的原因
- javascript - 通过 POST (Ajax) 的数组
- c# - 无法执行程序和程序包
- javascript - 在 vuejs 中使用 v-for 循环?
- mysql - 需要帮助理解 COUNT 和 <> 运算符(Hackerrank SQL 挑战问题)
- mysql - 什么是停止事务的查询?