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

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

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

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

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

好了