Reactjs 创建一个自定义装饰器“@&引用；要从中导入模块'；s父目录（JS）

我想使用自定义装饰器/注释（如

@material ui/core

模块）从目录导入模块，如下例所示：

而不是经典的进口

import class1 from '../../../../Services/module1';

我想用这个语法

import class1 from '@Services/module1';

谢谢你的帮助

在TS中：

"paths": {
      "@app/*": ["app/*"],
      "@env/*": ["environments/*"]
}

在tsconfig.json文件的编译器选项中

---

在Webpack:

我必须弹出我的reactJs项目（使用CRA创建）->编辑Webpack.config.js->添加别名：

  resolve: {
    extensions: ['.js', '.jsx'],
    alias: {
      '@pages': path.join(__dirname, '/src/pages'),
      '@components': path.join(__dirname, '/src/components'),
      '@assets': path.join(__dirname, '/src/assets'),
    },
  },

我建议使用

使用自定义根或别名在

.babelrc

中指定插件。下面是一个例子：

{
  "plugins": [
    ["module-resolver", {
      "root": ["./src"],
      "alias": {
        "~": "./app",
        "underscore": "lodash"
      }
    }]
  ]
}

---

@大马，我用的是Js而不是TS；）这不是装饰器或注释。使用不正确的术语无助于得到正确的答案。比如@material ui/core模块——不是这样的@物料界面为包范围。您试图做的是一个别名。这是非常具体的设置，没有解释。如果你直接使用网页包，那是一回事。如果你用的是CRA，那是另一个。@estus我用的是CRA的一个可能的副本。您可能希望使用react app rewired更改网页包配置，而不是在不弹出的情况下弹出CRA？实际上，有两种解决方案检查此问题，您可以将其直接放入您的package.json中