Vue.js 编译Vue项目时的冲突顺序
我目前在编译我的项目时遇到问题,已经尝试过了,但是当我部署我的应用程序时,我的工具栏和其他一些组件只是失去了它们的基本样式。 我当前的package.jsonVue.js 编译Vue项目时的冲突顺序,vue.js,webpack,sass,vuetify.js,vuetify-loader,Vue.js,Webpack,Sass,Vuetify.js,Vuetify Loader,我目前在编译我的项目时遇到问题,已经尝试过了,但是当我部署我的应用程序时,我的工具栏和其他一些组件只是失去了它们的基本样式。 我当前的package.json "dependencies": { "axios": "^0.19.2", "chart.js": "^2.9.3", "coordinates-converter": "0.0.2
"dependencies": {
"axios": "^0.19.2",
"chart.js": "^2.9.3",
"coordinates-converter": "0.0.2",
"core-js": "^2.6.11",
"css-loader": "^3.6.0",
"d3": "^5.16.0",
"jquery": "^2.2.4",
"justgage": "^1.4.0",
"konva": "^7.1.3",
"lodash": "^4.17.20",
"material-design-icons-iconfont": "^5.0.1",
"moment": "^2.29.1",
"portfinder": "^1.0.28",
"register-service-worker": "^1.6.2",
"sass": "^1.26.12",
"serve": "^11.3.0",
"style-loader": "^0.23.1",
"vue": "^2.6.12",
"vue-konva": "^2.1.6",
"vue-material-design-icons": "^4.9.0",
"vue-morris": "^1.0.1",
"vue-mqtt": "^2.0.3",
"vue-router": "^3.4.6",
"vue-speedometer": "^1.7.0",
"vuetify": "^2.3.13",
"vuetify-loader": "^1.6.0",
"vuex": "^3.5.1",
"xlsx": "^0.15.1"
},
我收到了这些警告
warning
chunk chunk-37cf0e67 [mini-css-extract-plugin]
Conflicting order. Following module has been added:
* css ./node_modules/css-loader/dist/cjs.js??ref--9-oneOf-3-1!./node_modules/postcss-loader/src??ref--9-oneOf-3-2!./node_modules/sass-loader/dist/cjs.js??ref--9-oneOf-3-3!./node_modules/vuetify/src/components/VDivider/VDivider.sass
despite it was not able to fulfill desired ordering with these modules:
* css ./node_modules/css-loader/dist/cjs.js??ref--9-oneOf-3-1!./node_modules/postcss-loader/src??ref--9-oneOf-3-2!./node_modules/sass-loader/dist/cjs.js??ref--9-oneOf-3-3!./node_modules/vuetify/src/components/VCard/VCard.sass
- couldn't fulfill desired order of chunk group(s) , , , , , , , , ,
* css ./node_modules/css-loader/dist/cjs.js??ref--9-oneOf-3-1!./node_modules/postcss-loader/src??ref--9-oneOf-3-2!./node_modules/sass-loader/dist/cjs.js??ref--9-oneOf-3-3!./node_modules/vuetify/src/components/VChip/VChip.sass
- couldn't fulfill desired order of chunk group(s) , , , , , ,
- while fulfilling desired order of chunk group(s) , , ,
...
我已经通过修改vuetify.js解决了这个问题 以前
import Vue from 'vue';
import Vuetify from 'vuetify';
import 'vuetify/dist/vuetify.min.css';
import './theme.css';
import zhHans from 'vuetify/es5/locale/zh-Hans';
Vue.use(Vuetify);
export default new Vuetify({
theme: {
dark: true,
themes: {
dark: {
primary: '#7fffff',
secondary: '#b0b0b0',
accent: '#82B1FF',
error: '#ffb0b0',
info: '#2196F3',
success: '#77f97c',
warning: '#FFC107',
},
},
},
lang: {
locales: { zhHans },
current: 'zhHans',
},
});
之后
如果您预先定义订单,此问题将消失。对我有效!谢谢
import './theme.css';
import zhHans from 'vuetify/es5/locale/zh-Hans';
import Vue from 'vue'
import Vuetify, {
VApp,
VToolbar,
VCard,
VBtn,
VIcon,
VProgressCircular,
VList,
VAvatar,
VListGroup,
} from 'vuetify/lib';
import {
Ripple
} from 'vuetify/lib/directives';
Vue.use(Vuetify, {
components: {
VApp,
VToolbar,
VCard,
VBtn,
VProgressCircular,
VList,
VListGroup,
VAvatar,
VIcon,
},
directives: {
Ripple,
},
})
const opts = {
theme: {
dark: true,
themes: {
dark: {
primary: '#7fffff',
secondary: '#b0b0b0',
accent: '#82B1FF',
error: '#ffb0b0',
info: '#2196F3',
success: '#77f97c',
warning: '#FFC107',
},
},
},
lang: {
locales: { zhHans },
current: 'zhHans',
},
}
export default new Vuetify(opts)