我正在尝试在 webpack 中实现一些别名。我想要做的是，而不是使用它从文件夹 components 中导入 App.js 上的组件。

./components/layout/Header/Header

我想要这个：

@components/layout/Header/Header

也就是说，为了避免将来创建嵌套文件夹时出现问题。我所做的是在 webpack.config.js

module.exports = {
    context: __dirname,entry: './src/index.js',output: {
        path: path.resolve( __dirname,'dist' ),filename: 'main.js',},resolve: {
        extensions: ['.js','.ts','.jsx','.tsx'],alias: {
          src: path.resolve(__dirname,'src'),assets: path.resolve(__dirname,'src/assets'),components: path.resolve(__dirname,'src/components'),}
    }
    .
    .
    .
};

这在 tsconfig.json 文件中：

{
  "compilerOptions": {
    "jsx": "react-jsx","target": "es5","lib": [
      "dom","dom.iterable","esnext"
    ],"baseUrl": ".","paths": {
      "@": ["./src/*"],"@assets": ["./src/assets/*"],"@components": ["./src/components/*"]
    },"allowJs": true,"skipLibCheck": true,"esModuleInterop": true,"allowSyntheticDefaultImports": true,"strict": true,"forceConsistentCasingInFileNames": true,"noFallthroughCasesInSwitch": true,"module": "esnext","moduleResolution": "node","resolveJsonmodule": true,"isolatedmodules": true,"noEmit": true,"include": [
    "src"
  ]
}

当我运行“npm run start”即“react-scripts start”时，出现以下错误：

./src/App.js
Module not found: Can't resolve '@components/layout/Header/Header' in 'C:\Users\Angel\Documents\React\thermometer\src' 

另外，我注意到当我运行“npm run start”时，我在 tsconfig.json 文件上创建的对象“路径”被删除，文件重置。我是从零开始创建反应项目的新人。提前致谢！