最近公司做的这个项目，要大量修改element里面的css样式，所以项目打包之后

会出现样式和本地开发的时候样式有很多不一样，原因可能是css加载顺序有问题，样式被覆改了。

所以在mian.js里面这样修改：

‘./APP’和'./router'放在element css的后面，router放到最后

还有就是每个vue组件里的style要加scoped,这很关键，起到css不被组件之间重叠的作用。

最后再次打包,会发现和本地开发的样式一模一样，开心的不得了，哈哈！

vue项目打包之后样式错乱问题，如何处理的更多相关文章

  1. 【转】vue项目打包部署——nginx代理访问

    我又来了,今天部署了下vue项目,使用nginx做了代理,这样可以解决跨域的问题,这里做一个简单讲解. 1.先看vue项目打包(我这里使用的是vscode开发工具) 这里是我的项目结构: 打包之前需要 ...

  2. vue项目打包采坑

    1. vue项目打包采坑 1.1. vue运行报错error:Cannot assign to read only property 'exports' of object '#' 这个错误我是在打包 ...

  3. Vue项目打包后背景图片路径错误

    vue项目打包之后背景图片出错的解决方案如下: 1,找到 config->index.js里面,如下修改 默认配置: env: require('./prod.env'), index: pat ...

  4. vue项目打包后运行报错400如何解决

    昨天一个Vue项目打包后,今天测试,发现无论localhost还是服务器上都运行不了,报错如下: Failed to load resource: the server responded with ...

  5. vue项目打包，生成dist文件夹，如何修改文件夹的名字

    vue项目打包之后的dist文件目录是如下 如果想要修改dist或则static文件名称,需要打开config / index.js build: { // Template for index.ht ...

  6. vue项目打包踩坑记

    基于webpack+vue-cli下的vue项目打包命令是 npm run build ,等待打包完成后在根目录生成dist文件夹,里面包含了所有项目相关的内容. 注意:需要完整版的vue-cli项目 ...

  7. vue项目打包-2-九五小庞

    vue项目打包 一.终端运行命令 npm run build 二.打包成功的标志与项目的改变,如下图: 3.点击index.html,通过浏览器运行,出现以下报错,如图: 四.那么应该如何修改呢?具体 ...

  8. vue项目打包成html，在本地点击直接能打开

    默认情况下vue项目打包后,本地打开index.html是空白的,有报错.Failed to load resource: net::ERR_FILE_NOT_FOUND 这时需要修改config-& ...

  9. vue 项目不显示样式 排版错乱

    vue中的css 样式都在index.html中 看这里是否有导入css

随机推荐

  1. 安装v2sora@y

    v2r@y安装 1. 安装nginx 这儿使用tengine进行安装, 可以看以前的博客 1.1) 注意带 http_v2 编译 ./configure --with-http_v2_module 不 ...

  2. 解决No 'Access-Control-Allow-Origin' header is present on the requested resource.跨域问题

    跨域错误 错误原因 解决方法在后台写一个过滤器过滤器来改写请求头头 CorsFilter.java public class CorsFilter implements Filter { @Overr ...

  3. Python 自定义元类的两种写法

    有关元类是什么大家自己搜索了解,我这里写一下实现元类的两种写法 # 自定义元类 #继承type class LowercaseMeta(type): ''' 修改类的属性名称为小写的元类 ''' # ...

  4. Winform中双击DevExpress的TreeList的树形节点怎样获取当前节点

    场景 DevExpress的TreeList怎样设置数据源,从实例入手: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/10254 ...

  5. 【转载】如何在Android中避免创建不必要的对象

    在编程开发中,内存的占用是我们经常要面对的现实,通常的内存调优的方向就是尽量减少内存的占用.这其中避免创建不必要的对象是一项重要的方面. Android设备不像PC那样有着足够大的内存,而且单个App ...

  6. 微信小程序底部导航栏（tabbar）

    在app.json处设置“tabBar”,例子如下: { "pages": [ "pages/index/index", "pages/pages1/ ...

  7. docker系列（四）：数据卷

    1 引言 容器就相当于一个简易的操作系统,我们在上面部署我们的环境,不可避免地产生一些数据,但是,可能由于断电等等原因,容器退出了,那么之前容器中的数据就不符存在,则往往不是我们想要的,更多的,我们是 ...

  8. excel如何快速选中某个区域

    一.问题 excel如何快速选中某个区域 二.解决 如图:要选中A1-D12的区域,可以选择用鼠标,单数数据量多的时候就比较麻烦,可以用下面这种方式.

  9. 5-4 可视化库Seaborn-回归分析

    In [2]: %matplotlib inline import numpy as np import pandas as pd from scipy import stats,integrate ...

  10. Excel中的一列数据变成文本的一行数据

    Excel中的一列数据变成文本的一行数据 作者:凯鲁嘎吉 - 博客园 http://www.cnblogs.com/kailugaji/