1、项目根目录创建tsconfig.extend.json文件
{
"compilerOptions": {
"baseUrl": "./src",
"paths": {
"@src/*": ["./*"],
"@api/*": ["./api/*"],
"@app/*": ["./app/*"],
"@assets/*": ["./assets/*"],
"@components/*": ["./components/*"],
"@utils/*": ["./utils/*"]
}
}
}
2、根目录文件tsconfig.json配置
新增 "extends": "./tsconfig.extend.json"
3、根目录craco.config.js文件配置
const CracoAlias = require("craco-alias");
module.exports = {
plugins: [
{
plugin: CracoAlias,
options: {
source: "tsconfig",
baseUrl: "./src",
tsConfigPath: "./tsconfig.extend.json",
}
}
]
}
4、npm start 重启项目。
5、使用
import logo from '@assets/home/logo.png';
<img src={logo} alt="logo" />