我有一个 React & Typescript & Webpack 样板文件。我不能在我的样板文件中使用别名。有人可以帮助我吗我在任何地方都找不到答案,这是我的代码。我总是收到这个错误
找不到模块“@src/pages/MainPages”或其相应的类型声明。
我的 webpack
module.exports = {
mode: process.env.NODE_ENV || 'development',
entry: "./src/index.tsx",
devtool: 'inline-source-map',
devServer: {
port: process.env.PORT || 3000,
open: true,
historyApiFallback: true,
proxy: {
'/api': 'http://localhost:3050'
}
},
output: {
path: path.resolve(__dirname, "./build"),
filename: "bundle.js"
},
resolve: {
extensions: [".ts", ".tsx", ".js", ".jsx", ".css", ".scss"],
alias: {
"@src": path.join(__dirname, "./src/*")
}
},
module: {
rules: [
{
test: /\.(js|jsx|ts|tsx)$/,
exclude: /node_modules/,
options: {
configFile: 'tsconfig.client.json'
},
loader: "ts-loader"
},
{
test: /\.html$/,
use: [
{
loader: "html-loader"
}
]
},
{
test: /\.(png|jpe?g|gif)$/i,
use: [
{
loader: "file-loader"
}
]
},
{
test: /\.s[ac]ss$/i,
use: [MiniCssExtractPlugin.loader, "css-loader", "sass-loader"]
}
]
},
plugins: [
new HtmlPlugin({
filename: "index.html",
template: "./public/index.html"
}),
new MiniCssExtractPlugin(),
new Dotenv()
]
}
这是我的 tsconfig.json
{
"compilerOptions": {
"outDir": "./build/",
"noImplicitAny": true,
"module": "es6",
"moduleResolution": "node",
"target": "es5",
"jsx": "react",
"allowSyntheticDefaultImports": true,
"lib":[
"es2015", "dom", "ES5", "ES6","DOM.Iterable","ES2015.Iterable"
],
"baseUrl": ".",
"paths": {
"@src": ["./src/*"]
}
},
"include": [
"src/**/*"
],
"exclude": [
"node_modules"
]
}
顺便说一下,当我运行项目时,它可以正常工作,但大多数情况下只会出现此错误