我试图通过将这些值添加到tsconfig来在项目中设置路径别名.json:

  "compilerOptions": {
    "baseUrl": "src",
    "paths": {
      "@store/*": ["store/*"]
    },

如果我创建了一个导入,IntelliJ或VSCode都不会打扰我:

import { AppState } from '@store/index';

但当我编译应用程序时,我得到以下警告:

The following changes are being made to your tsconfig.json file:
  - compilerOptions.paths must not be set (aliased imports are not supported)

它说找不到参考:

TypeScript error in C:/xyz.tsx(2,26):
Cannot find module '/store'.  TS2307

是否有解决方法,或者create-react-app --typescript不支持?

推荐答案

craco或rewired create-react-app的别名解决方案是100,用于系统as:cracoreact-app-rewiredcustomize-cra

根据上述系统的文档,在package.json中替换react-scripts,然后配置:

// config-overrides.js
const {alias, configPaths} = require('react-app-rewire-alias')

module.exports = function override(config) {
  return alias(configPaths('./tsconfig.paths.json'))(config)
}

Craco用户配置没有什么不同:

// craco.config.js
const {CracoAliasPlugin, configPaths} = require('react-app-rewire-alias')

module.exports = {plugins: [{
  plugin: CracoAliasPlugin,
  options: {alias: configPaths('./tsconfig.paths.json')}
}]}

在json中配置别名,如下所示:

// tsconfig.paths.json
{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "example/*": ["example/src/*"],
      "@library/*": ["library/src/*"]
    }
  }
}

并将此文件添加到主typescript配置文件的extends部分:

// tsconfig.json
{
  "extends": "./tsconfig.paths.json",
  // ...
}

Typescript相关问答推荐

如何在类型脚本中声明对象其键名称不同但类型相同?

如何根据数据类型动态注入组件?

在类型内部使用泛型类型时,不能使用其他字符串索引

在将对象从一个对象转换成另一个对象时,可以缩小对象的键吗?

我们过go 不能从TypeScript中的联合中同时访问所有属性?

当我点击外部按钮时,如何打开Html Select 选项菜单?

在泛型类型中对子代执行递归时出错

使用ngrok解析Angular 时出现HTTP故障

如何通过TypeScript中的工厂函数将区分的联合映射到具体的类型(如类)?

ANGLE找不到辅助‘路由出口’的路由路径

访问继承接口的属性时在html中出错.角形

为什么TypeScrip不能解析对象析构中的赋值?

Angular 16将独立组件作为对话框加载,而不进行布线或预加载

为什么TS2339;TS2339;TS2339:类型A上不存在属性a?

如何键入派生类的实例方法,以便它调用另一个实例方法?

如何将对象的字符串文字属性用作同一对象中的键类型

如何在TypeScript中声明逆变函数成员?

如何将 MUI 主题对象的自定义属性与情感样式组件中的自定义props 一起使用?

Angular另一个组件的nativeelement未定义

如果父级被删除或删除,如何自动删除子级?