首页 » Ruby » 在vue项目中使用Sass/Scss(视窗环境)

在vue项目中使用Sass/Scss(视窗环境)

原文 http://blog.csdn.net/CXSY3402/article/details/78636746

2017-11-27 02:00:53阅读(355)

第一步: 安装Ruby
1. 在使用Sass前,我们需要先安装Ruby。以上安装方法可以为我们快速设置好必要的设置,我们只需下载安装包,随后一切默认安装即可。
2. 安装程序也将安装一个Ruby命令行powershell应用程序,它可以让我们使用Ruby库。

—————————————————————————————————

第二步: 安装Sass 使用命令行安装,如cmd,git或者Ruby终端. 博主使用git初始化项目,所以这里也是用的git。 安装使用以下命令:
 npm install --save-dev sass-loader
 //sass-loader依赖于node-sass
 npm install --save-dev node-sass   

或者简写形式:

npm install sass-loader node-sass --save

注意: 以上适用于Scss的语法,使用Sass语法安装vue-loader

SCSS 与 Sass 异同 请参考Sass中国网站

1 现在我们可以检查一下Sass是否成功安装:

sass -v

2 安装成功应该有这个界面:

在vue项目中使用Sass/Scss(<a href=视窗环境)" src="http://img.blog.csdn.net/20171126131607283?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvQ1hTWTM0MDI=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="安装成功应该有这个界面" title="">

3 如果显示安装失败,命令行运行以下命令:

SASS_BINARY_SITE=https://npm.taobao.org/mirrors/node-sass/ npm install node-sass

—————————————————————————————————

第三步: 在vue中使用Sass 到这里只需要改写vue文件中的style标签即可。
    <style lang="scss"></style>
    <style lang="sass"></style>

最新发布

CentOS专题

关于本站

5ibc.net旗下博客站精品博文小部分原创、大部分从互联网收集整理。尊重作者版权、传播精品博文,让更多编程爱好者知晓!

小提示

按 Ctrl+D 键,
把本文加入收藏夹