angular-cli styles 全局样式引用无效

开发环境

1. webstorm
2. node
3. angular
4. angular-cli
5. npm(cnpm)

使用angular-cli 引入全局css样式：

"styles": [
   "styles.css",
   "../node_modules/bootstrap/dist/css/bootstrap.css"
 ],

发现页面没有加载任何bootstrap样式，但是npm start时没有报错，能正常启动。

原因

使用淘宝的npm镜像cnpm，使用cnpm install命令安装模块时，下载的带下划线，带@符号的才是文件的真身，bootstrap文件夹只是真身的快捷方式，如图：

解决方法

在.angular-cli.json文件中，使用实际地址，而非快捷方式：

"styles": [
  "styles.css",
  "../node_modules/_bootstrap@3.3.7@bootstrap/dist/css/bootstrap.css",
  "../node_modules/_admin-lte@2.4.2@admin-lte/dist/css/AdminLTE.min.css",
  "../node_modules/_admin-lte@2.4.2@admin-lte/dist/css/skins/skin-blue.min.css"
],