转载文章，若有侵权，请联系删除。

转自： https://majing.io/posts/10000018711176

作者：devgirl

Angular cli内部是基于webpack实现构建项目：

• 默认是没有webpack的配置文件webpack.config.js。
• 部分与webpack相关的配置可以在.angular-ci.json中设置。
• 如果需要定制的webpack.config.js，则需要使用eject命令发射出webpack.config.js

webpack alias可以让我们对路径设置别名，在模块之间引用是使用的是绝对路径，而不是../../../../mypath/MyComponent这种不直观的相对路径。

在.angular-cli.json中是没有提供类似webpack alias的配置。替代方案是使用tsconfig.json来配置。在angular-cli生成的项目修改如下：

在src/目录下修改tsconfig.app.json

{"compilerOptions": {...// 添加路径相关"baseUrl": ".","paths": {"@app/*": ["app/*"]}...},...
}

在项目根目录下修改tsconfig.json

{"compilerOptions": {...// 添加路径相关"baseUrl": "src","paths": {"@app/*": ["app/*"]}...},...
}

修改项目根目录的tsconfig.json是避免编译器报错（如webstorm）。