在angular-cli中引入了样式，也重启了，但样式不生效
来源：2-5 开发准备
5325
2018-04-14
1回答
-
慕盖茨2441358
2018-04-22
注意点：
安装的angular-cli必须是1.7.0版本以上。如果不是请卸载重装。
引用样式前，安装bootstrap： npm install bootstrap --save
看一下nodeJS的版本，我的本机是8.7.0，反正没什么问题。但实际可能不需要这么高的版本。
详细步骤如下所示：
2.1 starter page 网址
https://adminlte.io/themes/AdminLTE/starter.html
完整的模板文件网址：https://adminlte.io/themes/AdminLTE/index2.html
2.2 将starter page中的body内的内容copy至app.component.html。
2.3 修改index.html，在<body>标签上添加class="hold-transition skin-blue sidebar-mini"。
2.4 安装bootstrap： npm install bootstrap --save
注意：
npm install -g @angular/cli@latest 安装的是1.7.3版本，要使用bootstrap必须安装1.7.0版本以上。
npm install -g angular-cli@latest 安装的是1.0.0-beta.28版本
2.5 安装jquery：npm install jquery--save
2.6 修改全局样式文件styles.css，引入cdn在线样式
@import "https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic";
@import "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css";
@import "https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.0/css/ionicons.min.css";
2.7 修改.angular-cli.json，在styles和scripts中引入本地样式和脚本（前提是安装了bootstrap 和jquery）"styles": [
"styles.css",
"../node_modules/bootstrap/dist/css/bootstrap.min.css",
"../node_modules/admin-lte/dist/css/AdminLTE.min.css",
"../node_modules/admin-lte/dist/css/skins/skin-blue.min.css"
],
"scripts": [
"../node_modules/jquery/dist/jquery.min.js",
"../node_modules/bootstrap/dist/js/bootstrap.min.js",
"../node_modules/admin-lte/dist/js/adminlte.min.js"
],00
相似问题