vue 本地运行和打包部署后页面布局效果不一致的原因

原因：style 没有添加上；同一个盒子多次添加style(或者说和本地添加的style的顺序反了)

解决方式 ：
第一个原因：main.js 文件中 import 引入文件先后顺序问题

import Vue from 'vue'
import Print from 'vue-print-nb'
import Cookies from 'js-cookie'

import Element from 'element-ui'
import './assets/styles/element-variables.scss'

import '@/assets/styles/index.scss' // global css
import '@/assets/styles/biaogan.scss' // biaogan css

import permission from './directive/permission'

import './assets/icons' // icon
import './permission' // permission control
import { getDicts } from "@/api/system/dict/data";
import { getConfigKey } from "@/api/system/config";
import { parseTime, resetForm, addDateRange, selectDictLabel, selectDictLabels, download, handleTree } from "@/utils/biaogan";
import Pagination from "@/components/Pagination";
// 自定义表格工具扩展
import RightToolbar from "@/components/RightToolbar"

import dataV from '@jiaminghi/data-view'
import App from './App'
import store from './store'
import router from './router'

 

第二个原因： style  添加 scoped

<style scoped>

第三个原因： 前端代码错误，排查方式 本地代码和部署后的代码对比style。