vue+elementui项目打包后样式变化问题
博主刚刚解决了index.html空白问题,刚打开项目页面又发现了样式出现了大问题,样式与开发版本有很大不同,有些样式没有生效。利用搜索引擎,找到了问题所在以及解决办法:
main.js中的引入顺序决定了打包后css的顺序,组件内的样式没有生效可能是被第三方组件样式覆盖了,所以把第三方组件放在前面引入,router放在后面引入,就可以实现组件样式在第三方样式之后渲染。代码如下:
main.js
// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
//先引入第三方组件
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
//后引入router
import router from './router'
import store from './vuex/store' Vue.use(ElementUI) Vue.config.productionTip = false /* eslint-disable no-new */
new Vue({
el: '#app',
router,
store,
components: { App },
template: '<App/>'
})
————————————————
版权声明:本文为CSDN博主「Arlisol」的原创文章。
原文链接:https://blog.csdn.net/Dg_Zing/article/details/87907796
vue+elementui项目打包后样式变化问题的更多相关文章
- vue+webpack项目打包后背景图片加载不出来问题解决
在做VUE +的WebPack脚手架项目打包完成后,在IIS服务器上运行发现项目中的背景图片加载不出来检查项目代码发现是因为CSS文件中,背景图片引用的路径问题;后来通过修改配置文件,问题终于解决了, ...
- 将vue的项目打包后通过百度的BAE发布到网上的流程
经过两天的研究终于将VUE打包后的项目通过BAE发布到了网上.虽然接口方面还有一下问题但是自己还是很高兴的. 首先说一下这个项目需要用到的技术,vue+express+git+百度的应用引擎BAE. ...
- vue+webpack+element-ui项目打包优化速度与app.js、vendor.js打包后文件过大
从开通博客到现在也没写什么东西,最近几天一直在研究vue+webpack+element-ui项目打包速度优化,想把这几天的成果记录下来,可能对前端牛人来说我这技术比较菜,但还是希望给有需要的朋友提供 ...
- vue项目打包后想发布在apache www/vue 目录下
使用的是vue-element-admin做示例,可以参考Vue项目根据不同运行环境打包项目,其他项目应该大同小异. 使用vue-router的browserHistory模式,配置mode: 'hi ...
- vue项目打包后资源相对引用路径的和背景图片路径问题
vue项目中若要使用相对路径来获得相应静态资源,需要修改以下内容来确保项目打包后能正常运行. 1.修改config => index.js => build => assetsPub ...
- vue项目打包后运行报错400如何解决
昨天一个Vue项目打包后,今天测试,发现无论localhost还是服务器上都运行不了,报错如下: Failed to load resource: the server responded with ...
- Vue+elementUI build打包部署后字体图标丢失问题
错误描述:Vue+elementUI build打包部署后字体图标丢失,控制台显示文件element-icons.woff和element-icons.ttf文件404 错误展现: 控制台报错截图 ...
- vue 使用webpack打包后路径报错以及 alias 的使用
一.vue 使用webpack打包后路径报错(两步解决) 1. config文件夹 ==> index.js ==> 把assetsPublicPath的 '/ '改为 './' 2. b ...
- 关于vue+element-ui项目的分页,返回默认显示第一页的问题解决
关于vue+element-ui项目的分页,返回默认显示第一页的问题解决 问题描述 当前页面如下: 然后点击页码跳到第3页,然后在第三页点击页面链接跳转到新的页面 然后在新页面点击返回按钮,返 ...
随机推荐
- SimHash算法--文章相似度匹配
SimHash原理 1.SimHash背景 SimHash算法来自于 GoogleMoses Charikar发表的一篇论文"detecting near-duplicates for we ...
- jQuery(三)之 选择器(基础版)
对于jQuery的调用,我们一般都会传入参数 html: <div></div> js: console.log($('<a />')); console.log( ...
- 单词demantoite翠榴石demantoite英语
一般认为翠榴石demantoite的形成条件是: (1)围岩组成应该是贫铝富铁,且附近有钙质碳酸盐出露地区,即有利于“纯度高”的钙铁榴石结晶环境.否则,若钙铝榴石端员分子比增多,2价Fe必将直接影响晶 ...
- 小程序开发 解析内容中unicode转中文编码显示问题
如果对你有帮助的话麻烦点个[推荐]~最好还可以follow一下我的GitHub~感谢观看! 小程序后台返回数据的时候,html内容是经过unicode编码的不能直接显示,里边全是类似&#xxx ...
- Linux errno 与 Python
以下均为Linux环境测试. 起因: 开发的一个程序,经常会由于内存不足而被kill掉,使用的是os.system函数执行的,返回值总是35072,当时没多想.后来由于一些原因,要模拟OOM 被kil ...
- 控制跳转的tree视图显示的列表项数量
在act_window中,定义limit字段,可以指定打开的tree视图的记录数量. limit:列表视图中每个页面的记录数.
- Odoo销售模块
转载请注明原文地址:https://www.cnblogs.com/ygj0930/p/10825988.html 一:销售模块 销售模块的用途: 1)管理销售团队.销售人员:维护销售产品: 2)管理 ...
- python爬取站长之家植物图片
from lxml import etree from urllib import request import urllib.parse import time import os def hand ...
- linux日志详解-摘录
小编言:会看Linux日志是非常重要的,不仅在日常操作中可以迅速排错,也可以快速的定位.` Liunx的配置文件在/etc/rsyslog.d里,可以看到如下信息这里的意思是将不通的所有优先级的信息输 ...
- DFS 算法模板
dfs算法模板: 1.下一层是多节点的dfs遍历 def dfs(array or root, cur_layer, path, result): if cur_layer == len(array) ...