开发环境和生产环境不同导致的差异。主要是css层级有变动；
开发环境只是单纯的使用了style-loader进行style标签插入，不进行额外的处理，比如说资源合并和添加md5后缀等，这样做是为了让编译速度更快，开发体验更好。

1）开发环境下的style可能有5个;顺序为a.css  b.css c.css d.css e.css

而生产可能顺序就打乱了层级有改动

2）原本第三方ui库是以style注入的层级比极高（开发环境），生产环境即打包单独link引入

层级也有改变

生产环境下的

预加载全局的css和第三方css；返回第三方的慢；怎么先挂载到header里？？？？

开发环境

开发css加载顺序

3)本地开发样式浏览器前缀和生产不一样；生产被删除了

https://segmentfault.com/a/1190000016123664

https://juejin.im/post/5c35df04f265da6158775732

vue-cli中开发生产css注入形式不同导致bug的更多相关文章

  1. Vue Cli 中使用 Karma / Chrome 执行样式相关单元测试

    在 GearCase 开源项目 中,我使用了 Vue Cli 的默认测试框架.因此和样式相关的东西,都无法进行测试.因为它并不类似于无头浏览器,而是存在于虚拟内存之中. 现状 在如下 button.s ...

  2. vue cli 中关于vue.config.js中chainWebpack的配置

    Vue CLI  的官方文档上写:调整webpack配置最简单的方式就是在vue.config.js中的configureWebpack选项提供一个对象. Vue CLI 内部的 webpack 配置 ...

  3. vue cli中的env详解

    前言 相信使用过 vueCli 开发项目的小伙伴有点郁闷,正常开发时会有三个接口环境(开发,测试,正式),但是 vueCli 只提供了两种 development,production(不包含 tes ...

  4. vue.cli 中使用 less 来写css样式

    vue-cli 的webpack中已配置了less,但 package.json 中没有选项,为了方便开发中使用,需安装一下: 安装方式一: npm install less less-loader ...

  5. vue的cli中引入css文件

    在public文件中创建一个文件夹css,放进reset.css 在main.js中引入即可 import '../public/css/reset.css'就可以啦

  6. scss是什么？在vue.cli中的安装使用步骤是？有哪几大特性？

    css的预编译: 使用步骤: 第一步:用npm下三个loader(sass-loader.css-loader.node-sass): 第二步:在build目录找到webpack.base.confi ...

  7. Vue-axios 在vue cli中封装

    common/post.js import axios from 'axios' // 引入axios import qs from 'qs' // 引入qs axios.defaults.baseU ...

  8. Vue.js中css的作用域

    Vue.js中的css的作用域问题: 如果在vue组件下的style中定义样式,效果会作用于整个html页面,如果只想本组件的css样式只作用于本组件的话,在<style>标签里添加sco ...

  9. Vue CLI 是如何实现的 -- 终端命令行工具篇

    Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统,提供了终端命令行工具.零配置脚手架.插件体系.图形化管理界面等.本文暂且只分析项目初始化部分,也就是终端命令行工具的实现. 0. 用法 ...

随机推荐

  1. xpath元素定位方法

    XPath 使用路径表达式来选取 XML 文档中的节点或者节点集.这些路径表达式和我们在常规的电脑文件系统中看到的表达式非常相似.XPath 含有超过 100 个内建的函数.这些函数用于字符串值.数值 ...

  2. ffmpeg剪切视频

    测试的时候需要用到视频,原片太大了,就剪切几分钟来测试 ffmpeg -i input.mp4 -ss 0 -t 300 -acodec copy -vcodec copy -scodec copy ...

  3. Ruby小白入门笔记之 <Gemfile 文件>

    因为初学Ruby,四处查资料无果,才来的贴出亲自试过的操作,覆盖整个个人入门笔记博客中,故所有的操作,都以最明了的方式阐述,当你创建完一个新的Rails应用后,你发现JAVA中我们可以编写maven聚 ...

  4. Pycharm 常用快捷键-Windows版

    常用快捷键: Ctrl + / 行注释(可选中多行) Ctrl + Alt + L 代码格式化 Tab / Shift + Tab 缩进.不缩进当前行(可选中多行) Ctrl + D 复制选定的区域 ...

  5. WPF prism 类、属性和方法的导入和导出

    学习Prism一定要掌握依赖注入的应用,只有了解了Prism的依赖注入才能更好的使用Prism提升应用开发的架构. 首先说明Prism依赖注入有两种方式及MEF和Unity ,在Prism中是两个没有 ...

  6. WPF RTSP存储到一个文件中的位置

    Vlc.DotNet.Core.Medias.MediaBase media1 = new Vlc.DotNet.Core.Medias.PathMedia(" CodeGo.net med ...

  7. linux中安装rdesktop远程访问windows服务器

    下载rdesktop.此处提供一个.deb的下载包,下载地址.提取码:t020. 1.安装.终端输入 dpkg -i rdesktop_1.8.6-2_amd64.deb 安装中可能会提示错误: 缺少 ...

  8. 浏览器访问ipv6站点(未绑定主机的ipv6站点)

    我们在浏览器直接输入ipv6地址敲回车,一般情况下浏览器会跳转到搜索引擎进行搜索. 我们需要在浏览器器中输入: http://[::1]  或者 [::1]

  9. cocos2dx基础篇(4) 标签CCLabel

    [本节内容] cocos2dx三种文字字体的显示:CCLabelTTF(一般字体).CCLabelAtlas(自定义字体).CCLabelBMFont(自定义字体) CCLabelTTF CCLabe ...

  10. ELK+Kafka

    kafka:接收java程序投递的消息的日志队列 logstash:日志解析,格式化数据为json并输出到es中 elasticsearch:实时搜索搜索引擎,存储数据 kibana:基于es的数据可 ...