首页 > 其他 > 详细

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

时间:2018-07-27 12:56:28      阅读:320      评论:0      收藏:0      [点我收藏+]

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

1,安装依赖:

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

注:

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

技术分享图片

可以通过淘宝的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:
如下图:
技术分享图片

 

如上添加配置scss:

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

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

技术分享图片

 

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

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

原文:https://www.cnblogs.com/maqingyuan/p/9376853.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!