chore!: default to dart sass for sass option of cssPreprocessor (#3921)

haoqunjiang · web-flow · commit f4e6c3304414 · 2019-04-30T23:33:37.000+08:00
BREAKING CHANGE:
Preset generated before v3.4.0 may contain a `"cssPreprocessor": "sass"`
field. It now means dart-sass rather than node-sass.

`rootOptions.cssPreprocessor === 'sass'` now also means dart sass.
May affect those generator plugins who depends on this field
diff --git a/packages/@vue/cli-service/__tests__/generator.spec.js b/packages/@vue/cli-service/__tests__/generator.spec.js
@@ -1,6 +1,6 @@
 const generateWithPlugin = require('@vue/cli-test-utils/generateWithPlugin')
 
-test('node sass (legacy)', async () => {
+test('sass (default)', async () => {
   const { pkg, files } = await generateWithPlugin([
     {
       id: '@vue/cli-service',
@@ -12,7 +12,7 @@ test('node sass (legacy)', async () => {
   ])
 
   expect(files['src/App.vue']).toMatch('<style lang="scss">')
-  expect(pkg).toHaveProperty(['devDependencies', 'node-sass'])
+  expect(pkg).toHaveProperty(['devDependencies', 'sass'])
 })
 
 test('node sass', async () => {
diff --git a/packages/@vue/cli-service/generator/index.js b/packages/@vue/cli-service/generator/index.js
@@ -35,13 +35,12 @@ module.exports = (api, options) => {
 
   if (options.cssPreprocessor) {
     const deps = {
-      // TODO: remove 'sass' option in v4 or rename 'dart-sass' to 'sass'
       sass: {
-        'node-sass': '^4.9.0',
+        sass: '^1.19.0',
         'sass-loader': '^7.1.0'
       },
       'node-sass': {
-        'node-sass': '^4.9.0',
+        'node-sass': '^4.12.0',
         'sass-loader': '^7.1.0'
       },
       'dart-sass': {
diff --git a/packages/@vue/cli/lib/options.js b/packages/@vue/cli/lib/options.js
@@ -13,7 +13,6 @@ const presetSchema = createSchema(joi => joi.object().keys({
   router: joi.boolean(),
   routerHistoryMode: joi.boolean(),
   vuex: joi.boolean(),
-  // TODO: remove 'sass' or make it equivalent to 'dart-sass' in v4
   cssPreprocessor: joi.string().only(['sass', 'dart-sass', 'node-sass', 'less', 'stylus']),
   plugins: joi.object().required(),
   configs: joi.object()
diff --git a/packages/@vue/cli/lib/util/inferRootOptions.js b/packages/@vue/cli/lib/util/inferRootOptions.js
@@ -20,10 +20,9 @@ module.exports = function inferRootOptions (pkg) {
 
   // cssPreprocessors
   if ('sass' in deps) {
-    rootOptions.cssPreprocessor = 'dart-sass'
-  } else if ('node-sass' in deps) {
-    // TODO: change to 'node-sass' in v4
     rootOptions.cssPreprocessor = 'sass'
+  } else if ('node-sass' in deps) {
+    rootOptions.cssPreprocessor = 'node-sass'
   } else if ('less-loader' in deps) {
     rootOptions.cssPreprocessor = 'less'
   } else if ('stylus-loader' in deps) {
