vue工程build后css样式失效问题

项目开发完成后，执行npm run build进行打包，将打包完成的dist文件部署在服务器。配置好域名解析，就可以实现工程上线。上线后，我们有时候会发现，它怎么和本地调试时长得不一样？长得不一样是样式问题，是打包的时候顺序先后问题，有一些样式没有生效，有一些样式被覆盖了。这时候可以考虑以下几种方法。1.main.js样式引入顺序问题有时候我们发现组件内的样式没有生效，可...

熊彬彬

3734人浏览 · 2020-01-12 21:30:08

熊彬彬 · 2020-01-12 21:30:08 发布

项目开发完成后，执行

 npm run build

进行打包，将打包完成的dist文件部署在服务器。配置好域名解析，就可以实现工程上线。上线后，我们有时候会发现，它怎么和本地调试时长得不一样？

长得不一样是样式问题，是打包的时候顺序先后问题，有一些样式没有生效，有一些样式被覆盖了。这时候可以考虑以下几种方法。

1.main.js样式引入顺序问题

有时候我们发现组件内的样式没有生效，可能是被第三方组件样式覆盖了，main.js中router放在最后引入，就可以实现组件样式在第三方样式之后渲染。

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^