Node Sass еще не поддерживает вашу текущую среду: обновление Vuetify завершается неудачно - PullRequest
Новая
       75

Node Sass еще не поддерживает вашу текущую среду: обновление Vuetify завершается неудачно

0 голосов
/ 25 сентября 2019

Я пытаюсь обновить Vuetify 1.5.+ до 2.0.+, но сталкиваюсь с некоторыми проблемами при добавлении библиотеки node-sass.Первоначально, когда я установил sass-loader": "^8.0.0", он показал некоторую синтаксическую ошибку следующим образом.

enter image description here

Итак, чтобы исправить проблему, я просто понизил sass-loaderс 8.+ до 7.+ после этого он выдал какую-то другую проблему следующим образом.

enter image description here

После этого я просто пробовал разные версии и все показывалита же проблема и в ссылке она показывает как поддерживается - https://github.com/sass/node-sass/releases/tag/v4.9.4(OSX и версия узла 10).Даже я попробовал другую версию узла, и, похоже, ничего не работает.

Текущая версия узла: v10.16.3

package.json :

{
   /***.. ................ other details ******/

  "dependencies": {
    "@mdi/font": "^3.5.95",
    "@nuxtjs/axios": "^5.3.6",
    "@nuxtjs/pwa": "^2.6.0",
    "await-to-js": "^2.1.1",
    "boxen": "^3.1.0",
    "cli-table": "^0.3.1",
    "colors": "^1.3.3",
    "commander": "^2.19.0",
    "cross-env": "^5.2.0",
    "debug": "^4.1.1",
    "emittery": "^0.4.1",
    "express": "^4.16.4",
    "fast-levenshtein": "^2.0.6",
    "glob": "^7.1.3",
    "jsonfile": "^5.0.0",
    "knex": "^0.19.2",
    "lodash": "^4.17.11",
    "material-design-icons": "^3.0.1",
    "mkdirp": "^0.5.1",
    "moment": "^2.24.0",
    "monaco-editor": "^0.16.2",
    "monaco-editor-webpack-plugin": "^1.7.0",
    "monaco-themes": "^0.2.5",
    "mssql": "^5.0.5",
    "mysql": "^2.16.0",
    "nano-assign": "^1.0.1",
    "nodemailer": "^6.3.0",
    "nuxt": "^2.8.1",
    "nuxt-material-design-icons": "^1.0.4",
    "oracledb": "^3.1.2",
    "pg": "^7.9.0",
    "pify": "^4.0.1",
    "popper.js": "^1.14.7",
    "rmdir": "^1.2.0",
    "sql-formatter": "^2.3.2",
    "sqlite3": "^4.0.8",
    "stripe": "^6.32.0",
    "tcp-port-used": "^1.0.1",
    "v-hotkey": "^0.3.1",
    "vee-validate": "^2.2.0",
    "vue": "^2.6.10",
    "vue-click-outside": "^1.0.7",
    "vue-drag-resize": "^1.3.2",
    "vue-draggable-resizable": "^2.0.0-rc1",
    "vue-monaco": "^0.3.1",
    "vue-recaptcha": "^1.1.1",
    "vue-shortcuts": "^1.1.2",
    "vue-shortkey": "^3.1.7",
    "vue-stripe-elements-plus": "^0.2.9",
    "vuetify": "^2.0.18",
    "vuetify-loader": "^1.2.1",
    "vuex-persistedstate": "^2.5.4"
  },
  "devDependencies": {
    "babel-eslint": "^10.0.1",
    "chai": "^4.2.0",
    "chokidar": "^2.1.5",
    "cross-env": "^5.1.4",
    "deepmerge": "^4.0.0",
    "devtron": "^1.4.0",
    "electron": "^4.1.4",
    "electron-builder": "^20.39.0",
    "electron-devtools-installer": "^2.2.4",
    "electron-renderer": "^2.0.4",
    "eslint": "6.4.0",
    "eslint-config-airbnb-base": "^13.1.0",
    "eslint-config-prettier": "^4.1.0",
    "eslint-config-standard": ">=12.0.0",
    "eslint-friendly-formatter": "^3.0.0",
    "eslint-loader": "^2.1.2",
    "eslint-plugin-import": ">=2.16.0",
    "eslint-plugin-jest": ">=22.3.0",
    "eslint-plugin-mocha": "^5.3.0",
    "eslint-plugin-node": ">=8.0.1",
    "eslint-plugin-nuxt": ">=0.4.2",
    "eslint-plugin-prettier": "^3.0.1",
    "eslint-plugin-promise": ">=4.0.1",
    "eslint-plugin-standard": ">=4.0.0",
    "eslint-plugin-vue": "^5.2.2",
    "fibers": "^4.0.1",
    "jsdoc": "^3.5.5",
    "minami": "^1.2.3",
    "mocha": "^6.0.2",
    "node-sass": "4.9.4",
    "nodemon": "^1.18.9",
    "nyc": "^14.1.1",
    "prettier": "^1.16.4",
    "sass": "^1.22.12",
    "sass-loader": "^7.1.0",
    "should": "^13.2.3",
    "stylus": "^0.54.5",
    "stylus-loader": "^3.0.2"
  }
}

Я пытался выполнить следующие действия, но, похоже, ничего не работает.

  1. Пробовал разные версии и сделал npm, перестроил node-sass
  2. Очистил кэш npm, удалил node_modules, а затем npm install

1 Ответ

1 голос
/ 26 сентября 2019

Надеюсь, это вам пригодится.

Во-первых, проверьте версию библиотеки sass & sass-loader. 

"devDependencies": {
  "@vue/cli-plugin-babel": "^3.9.0",
  "@vue/cli-plugin-eslint": "^3.9.0",
  "@vue/cli-service": "^3.9.0",
  "sass": "^1.18.0",
  "sass-loader": "^7.1.0",
  "deepmerge": "^4.0.0"
}

Во-вторых, проверьте синтаксис loaderOptions и chainWebpack.

Вы должны использовать точку с запятой ; в правилах SCSS 

module.exports = {
  css: {
    loaderOptions: {
      sass: {
        data: `@import "~@/sass/main.scss"`,
      },
    },
  },
  chainWebpack: config => {
    ["vue-modules", "vue", "normal-modules", "normal"].forEach((match) => {
      config.module.rule('scss').oneOf(match).use('sass-loader')
        .tap(opt => Object.assign(opt, { data: `@import '~@/sass/main.scss';` }))
    })
  }
}
...