Привет! Я использую пользовательские компоненты в Vuetify v2.2, которые выдают ошибку во время сборки.
Я не могу понять, в чем проблема с Vuetify v2.2, потому что Vuetify v2.1.15 работал хорошо.
Выдается сообщение об ошибке:
ERROR in ./node_modules/vuetify/src/components/VCalendar/VCalendarDaily.sass (./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!./node_modules/postcss-loader/src??ref--6-oneOf-1-2!./node_modules/sass-loader/dist/cjs.js??ref--6-oneOf-1-3!./node_modules/vuetify/src/components/VCalendar/VCalendarDaily.sass)
Module build failed (from ./node_modules/postcss-loader/src/index.js):
TypeError: Cannot read property 'type' of undefined
at /home/ubuntu/chainflix-nuxt-tar/node_modules/vuetify/src/components/VCalendar/VCalendarDaily.sass:1:257
at stringifyNode (/home/ubuntu/chainflix-nuxt-tar/node_modules/postcss-value-parser/lib/stringify.js:2:19)
at Function.stringify (/home/ubuntu/chainflix-nuxt-tar/node_modules/postcss-value-parser/lib/stringify.js:45:10)
at Gradient.colorStops (/home/ubuntu/chainflix-nuxt-tar/node_modules/autoprefixer/lib/hacks/gradient.js:503:26)
at Gradient.oldWebkit (/home/ubuntu/chainflix-nuxt-tar/node_modules/autoprefixer/lib/hacks/gradient.js:396:10)
at Gradient.replace (/home/ubuntu/chainflix-nuxt-tar/node_modules/autoprefixer/lib/hacks/gradient.js:89:30)
at Gradient.add (/home/ubuntu/chainflix-nuxt-tar/node_modules/autoprefixer/lib/value.js:148:20)
at Gradient.add (/home/ubuntu/chainflix-nuxt-tar/node_modules/autoprefixer/lib/hacks/gradient.js:570:35)
at Gradient.process (/home/ubuntu/chainflix-nuxt-tar/node_modules/autoprefixer/lib/prefixer.js:155:16)
at /home/ubuntu/chainflix-nuxt-tar/node_modules/autoprefixer/lib/processor.js:379:36
at /home/ubuntu/chainflix-nuxt-tar/node_modules/postcss/lib/container.js:190:18
at /home/ubuntu/chainflix-nuxt-tar/node_modules/postcss/lib/container.js:135:18
at Rule.each (/home/ubuntu/chainflix-nuxt-tar/node_modules/postcss/lib/container.js:101:16)
at Rule.walk (/home/ubuntu/chainflix-nuxt-tar/node_modules/postcss/lib/container.js:131:17)
at /home/ubuntu/chainflix-nuxt-tar/node_modules/postcss/lib/container.js:148:24
at Root.each (/home/ubuntu/chainflix-nuxt-tar/node_modules/postcss/lib/container.js:101:16)
at Root.walk (/home/ubuntu/chainflix-nuxt-tar/node_modules/postcss/lib/container.js:131:17)
@ ./node_modules/vuetify/src/components/VCalendar/VCalendarDaily.sass 4:14-213
@ ./node_modules/vuetify/lib/components/VCalendar/VCalendarDaily.js
@ ./node_modules/vuetify/lib/components/VCalendar/index.js
@ ./node_modules/vuetify/lib/components/index.js
@ ./node_modules/vuetify/lib/index.js
@ ./components/inc/vuetifyCustom/CTextarea/CTextarea.js
@ ./components/inc/vuetifyCustom/CTextarea/index.js
@ ./plugins/GlobalComponent.js
@ ./.nuxt/index.js
@ ./.nuxt/client.js
@ multi ./.nuxt/client.js
В CTextarea Я импортировал VTextarea и VInput, например:
import { VTextarea, VInput } from 'vuetify/lib'
import 'vuetify/src/components/VTextarea/VTextarea.sass'
import { CTextField } from '../CTextField'
export default Vue.extend({
name: 'CTextarea',
extends: VTextarea.extend(),
///// etc custom codes
})
Я думаю, что эта ошибка имеет некоторую корреляцию с sass & post css. Я надеюсь построить успешно.
Я должен использовать опции Vue .config.optionMergeStrategies в пользовательских компонентах.
Мои зависимости пакета и devDependencies
{
"dependencies": {
"@babel/runtime-corejs3": "^7.6.3",
"@nuxtjs/axios": "^5.8.0",
"@nuxtjs/moment": "^1.4.0",
"@nuxtjs/style-resources": "^1.0.0",
"base64toblob": "0.0.2",
"bigdecimal": "^0.6.1",
"camelcase-keys": "^5.2.0",
"core-js": "^3.3.6",
"cross-env": "^5.2.1",
"crypto": "^1.0.1",
"eventsource-polyfill": "^0.9.6",
"express": "^4.16.4",
"filestream": "^4.1.3",
"firebase": "^7.5.2",
"form-data": "^2.5.1",
"intersection-observer": "^0.7.0",
"ip-regex": "^4.1.0",
"morgan": "^1.9.1",
"nuxt": "^2.10.2",
"qrcode": "^1.4.3",
"snakecase-keys": "^2.1.0",
"socket.io-client": "^2.3.0",
"uuid": "^3.3.3",
"vue-clipboard2": "^0.3.1",
"vue-drag-drop": "^1.1.4",
"vue-google-charts": "^0.3.2",
"vue-i18n": "^8.15.0",
"vue-lottie": "^0.2.1",
"vue-ls": "^3.2.1",
"vue-qrcode": "^0.2.2",
"vuedraggable": "^2.23.2",
"vuejs-logger": "^1.5.3"
},
"devDependencies": {
"@babel/core": "^7.6.4",
"@babel/plugin-proposal-class-properties": "^7.0.0",
"@babel/plugin-proposal-decorators": "^7.6.0",
"@babel/plugin-proposal-export-namespace-from": "^7.0.0",
"@babel/plugin-proposal-function-sent": "^7.0.0",
"@babel/plugin-proposal-json-strings": "^7.0.0",
"@babel/plugin-proposal-numeric-separator": "^7.0.0",
"@babel/plugin-proposal-throw-expressions": "^7.0.0",
"@babel/plugin-syntax-dynamic-import": "^7.0.0",
"@babel/plugin-syntax-import-meta": "^7.0.0",
"@babel/plugin-syntax-jsx": "^7.0.0",
"@babel/plugin-transform-modules-commonjs": "^7.6.0",
"@babel/plugin-transform-regenerator": "^7.4.5",
"@babel/plugin-transform-runtime": "^7.6.2",
"@babel/plugin-transform-template-literals": "^7.2.0",
"@babel/preset-env": "^7.6.3",
"@babel/register": "^7.6.2",
"@babel/runtime": "^7.6.3",
"@nuxt/babel-preset-app": "^2.10.2",
"@nuxtjs/eslint-config": "^0.0.1",
"@nuxtjs/vuetify": "^1.10.1",
"babel-eslint": "^10.0.3",
"babel-loader": "^8.0.5",
"deepmerge": "^4.2.2",
"fibers": "^4.0.2",
"nodemon": "^1.19.4",
"prettier": "^1.16.4",
"regenerator-runtime": "^0.13.2",
"sass": "^1.23.3",
"vue-style-loader": "^4.1.2",
"webpack-bundle-analyzer": "^3.6.0"
},
}
- Если вам нужна дополнительная информация, пожалуйста, прокомментируйте. Я действительно надеюсь исправить это.