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

好了

转载于:https://juejin.im/post/5cd9277ee51d453a506b0f00