sublime sass 自动编译,自动添加浏览器前缀

 

1. sass编译需要ruby的支持，如果还没有安装先去安装

   安装完成ruby后使用 `gem install sass`安装sass

   查看是否安装成功 `sass -v`

2.  安装编译环境

   npm install -g postcss-cli autoprefixer

3.  安装插件，使用sublime安装一下插件

   保存自动编译         SublimeOnSaveBuild

        SASS编译         Sass Build

      浏览器前缀          Autoprefixer

4.  在sublime中选择 Tool --> Build System --> New Build System创建一个编译环境,如SCSS。内容如下

   {

    

   "cmd": [

   "sass", "--update", "$file:${file_path}/../css/${file_base_name}.css", "--stop-on-error", "--no-cache",

   "&&",

   "postcss", "--use", "autoprefixer", "${file_path}/../css/${file_base_name}.css", "-d", "${file_path}/../css"

   ],

   "selector": "source.sass, source.scss",

   "line_regex": "Line ([0-9]+):",

    

   "osx":

   {

   "path": "/usr/local/bin:$PATH"

   },

    

   "windows":

   {

   "shell": "true"

   }

    

   }

5.  在sublime选择刚才设置的编译环境，勾选保存编译
   

    

6. 打开一个scss文件,保存。可查看css已经生成并且增加了浏览器前缀

   

   

    

   原文地址：https://jingyan.baidu.com/article/d45ad148a26db969552b80e8.html