一.使用ts構建的react項目，現在tsconfig.json文件中配置baseUrl和paths。由于直接在tsconfig.json里面配置paths字段后重啟項目，會將配置好的paths自動移除，所以采用extends字段讓tsconfig.json繼承自定義的tsconfig.paths.json。步驟如下：
1.現在項目根目錄下創建tsconfig.paths.json文件,內容如下：
{
? "compilerOptions": {
? ? "baseUrl": "./",
? ? "paths": {
? ? ? "@/*": ["src/*"]
? ? }
? }
}
2.在tsconfig.json中繼承tsconfig.paths.json文件，使用了tsconfig.json提供的extends字段:
{
? "compilerOptions": {
? ? "target": "es5",
? ? "lib": [
? ? ? "dom",
? ? ? "dom.iterable",
? ? ? "esnext"? ? ],
? ? "allowJs":true,
? ? "skipLibCheck":true,
? ? "esModuleInterop":true,
? ? "allowSyntheticDefaultImports":true,
? ? "strict":true,
? ? "forceConsistentCasingInFileNames":true,
? ? "noFallthroughCasesInSwitch":true,
? ? "module": "esnext",
? ? "moduleResolution": "node",
? ? "resolveJsonModule":true,
? ? "isolatedModules":true,
? ? "noEmit":true,
? ? "jsx": "react-jsx",
? ? "experimentalDecorators":true? },
? "include": [
? ? "src"? ],
? "extends": "./tsconfig.paths.json"}
3.配置完tsconfig.json文件后，就需要安裝customize-cra和react-app-rewired庫：
yarn add customize-cra react-app-rewired --save-dev
4.修改package.json:
"scripts": {
? ? "start": "react-app-rewired start",
? ? "build": "react-app-rewired build",
? ? "test": "react-app-rewired test",
? ? "eject": "react-app-rewired eject"? }
5.在項目根目錄下新建config-overrides.js（只能是js文件，別建成ts文件了），內容如下：
const { override, addDecoratorsLegacy, addWebpackAlias } = require("customize-cra");
const path = require("path");
module.exports =? override(
? addDecoratorsLegacy(),
? addWebpackAlias({
? ? "@": path.resolve(__dirname, './src')
? })
);
6.配置完成，可以在項目中使用如：import App from "@/App"的導入方式了
