继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

vue 项目 使用sass以及注意事项

牛魔王的故事
关注TA
已关注
手记 196
粉丝 111
获赞 628

vue 项目 使用sass以及注意事项

1,安装依赖:

npm install node-sass --save-dev
npm install sass-loader --save-dev

注:

通常使用npm安装会出现以下报错,安装失败。(网路问题)

https://img3.mukewang.com/5b5b1a1e00019a6c09340059.jpg

可以通过淘宝的npm镜像安装node-sass,解决以上问题。

$ npm install -g cnpm --registry=https://registry.npm.taobao.org  (安装淘宝镜像)

$ cnpm install node-sass  --save (使用淘宝镜像安装node-sass)

注:安装淘宝镜像后,仍无法安装node-sass的情况,执行下列命令

$ npm install --save node-sass --registry=https://registry.npm.taobao.org --disturl=https://npm.taobao.org/dist --sass-binary-site=http://npm.taobao.org/mirrors/node-sass

说明:

 --registry=https://registry.npm.taobao.org 淘宝npm包镜像 --disturl=https://npm.taobao.org/dist 淘宝node源码镜像,一些二进制包编译时用 --sass-binary-site=http://npm.taobao.org/mirrors/node-sass 这个才是node-sass镜像 2,进入webpack.base.config.js 配置scss:如下图:https://img4.mukewang.com/5b5b1a2600014b5910340949.jpg

 

如上添加配置scss:

{
     test: /\.scss$/,
     loaders: ["style", "css", "sass"]
}

3,如何引用外部的scss文件。

https://img3.mukewang.com/5b5b1a300001fa8704580376.jpg

 

如有不足之处,请多多指教!!!github项目地址:https://github.com/whiskyma

原文出处:http://www.cnblogs.com/maqingyuan/p/9376853.html

打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP