Vue CLI2 项目 node-sass切换为dart-sass

于2016年11月1日在博客正式对外公布了alpha版本的Dart Sass 42项目，即他们使用Dart对Sass进行了重写。至于原因反正就是屌····

公司项目大部分是基于vue cli2构建的，默认当然也是用node-sass来处理sass或scss的，每次有小伙伴们clone下来项目后一顿操作，npm i就卡到node-sass上了（虽然我认为红杏出墙是搬砖程序员必备技能但····）

今天就把node-sass换掉吧，参考文档

build/utils.js

generateLoaders方法里

修改前

return {
    css: generateLoaders(),
    postcss: generateLoaders(),
    less: generateLoaders(less),
    sass: generateLoaders(sass, { indentedSyntax: true }),
    scss: generateLoaders(sass),
    stylus: generateLoaders(stylus),
    styl: generateLoaders(stylus)
  }
复制代码

修改后

return {
    css: generateLoaders(),
    postcss: generateLoaders(),
    less: generateLoaders(less),
    // to use Dart Sass
    sass: generateLoaders("sass", {
      indentedSyntax: true,
      implementation: require("sass")
    }),
    scss: generateLoaders("sass",{
      implementation: require("sass")
    }),
    stylus: generateLoaders(stylus),
    styl: generateLoaders(stylus)
  }
复制代码

然后npm i sass -D 记得uninstall掉node-sass

好了

于2016年11月1日在博客正式对外公布了alpha版本的Dart Sass 42项目，即他们使用Dart对Sass进行了重写。至于原因反正就是屌···· 公司项目大部分是基于vue cli2构建的，默认当然也是用node-sass来处理sass或scss的，每次有小伙伴们clone下来项目后一顿操作，npm i就卡到node-sass上了（虽然我认为红杏出墙是搬砖程序员必备技能但····） 今天就把node-sass换掉吧，参考文档 build/utils.js generateLoaders方法里 修改前 return { css: generateLoaders(), postcss: generateLoaders(), less: generateLoaders(less), sass: generateLoaders(sass, { indentedSyntax: true }), scss: generateLoaders(sass), stylus: generateLoaders(stylus), styl: generateLoaders(stylus) } 复制代码 修改后 return { css: generateLoaders(), postcss: generateLoaders(), less: generateLoaders(less), // to use Dart Sass sass: generateLoaders("sass", { indentedSyntax: true, implementation: require("sass") }), scss: generateLoaders("sass",{ implementation: require("sass") }), stylus: generateLoaders(stylus), styl: generateLoaders(stylus) } 复制代码 然后npm i sass -D 记得uninstall掉node-sass 好了