最近公司做的这个项目，要大量修改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. P3376 网络最大流模板（Dinic + dfs多路增广优化 + 炸点优化 + 当前弧优化）

    ### P3376 题目链接 ### 这里讲一下三种优化的实现以及正确性. 1.dfs多路增广优化 一般的Dinic算法中是这样的,bfs() 用于标记多条增广路,以至于能一次 bfs() 出多次 d ...

  2. glibc编译安装

    glibc是gnu发布的libc库,即c运行库.glibc是linux系统中最底层的api,几乎其它任何运行库都会依赖于glibc.glibc除了封装linux操作系统所提供的系统服务外,它本身也提供 ...

  3. Docker学习——Dockerfile

    上一篇我们讲了docker的基本使用,掌握了前一篇,docker使用基本不成问题,但是要是你学习了Dockerfile,你会发现它使用起来有多方便了.项目最终部署时,我们希望docker容器打开时项目 ...

  4. PHPStorm设置等号对齐

    为了代码的美观,我们常常会把代码等号设置对齐,手动对齐的效率很低,PHPStrom提供了快捷键来一键对齐. 首先设置PHPStorm 设置完PHPStorm后,使用快捷键Command+Option+ ...

  5. 转载:点云上实时三维目标检测的欧拉区域方案 ----Complex-YOLO

    感觉是机器翻译,好多地方不通顺,凑合看看 原文名称:Complex-YOLO: An Euler-Region-Proposal for  Real-time 3D Object Detection ...

  6. 5.智能快递柜(通信篇-Server程序)

    1.智能快递柜(开篇) 2.智能快递柜(终端篇) 3.智能快递柜(通信篇-HTTP) 4.智能快递柜(通信篇-SOCKET) 5.智能快递柜(通信篇-Server程序) 6.智能快递柜(平台篇) 7. ...

  7. Razor 页面解说

    自己开始从头深造- 本是想将时间缩短,但发现自己还是很难呀.希望你理解吧,这里的知识 是 页面的基本信息.也页面的跳转关系和 Tag的帮助标签. Section   PartView.  @page ...

  8. Javase之集合体系（4）之Map集合

    集合体系之Map集合 ##Map<K,V>( 接口 ) 特点:将键映射到值对象,一个映射不能包含重复的键:每个键只能映射一个值 Map集合与Collection集合的区别 ​ Map集合存 ...

  9. ble蓝牙扫描几种方式

    有空再更新内容 方式一BluetoothAdapter层扫描回调 在高版本api已过时 方式二BluetoothLeScanner层扫描回调 android>= 5.0之后的版本推荐使用 方式三 ...

  10. 跳转常规 -- 为什么不要使用404、500等http状态码作为业务代码响应

    不要使用HTTP状态码作为业务代码响应 HTTP状态码 是指浏览器访问网址,成功或异常时浏览器或服务器告知用户的代码数字,它指的是网络或服务器的状态,有着不同的含义. 参加MDN.Java Api,常 ...