npm run build 与 npm run serve Vuejs 上的模板更改

分享于2022年12月29日 javascript metronic vue.js vuejs2 vuetify.js 问答
【问题标题】:template changes on npm run build vs npm run serve Vuejsnpm run build 与 npm run serve Vuejs 上的模板更改
【发布时间】:2022-12-21 02:09:15
【问题描述】:

你好,我使用 metronic 模板(vue js 版本)版本 7 和 vue2,节点版本 16,我的大部分页面都是用 vuetify 制作的我的问题是当我使用 npm run serve 一切正常,我的 ui 结构是它应该的样子但是当我运行 npm run build 时,事情变得一团糟,如下例所示。

npm 运行构建:

npm 运行服务:

此页面代码:



  
    
      mdi-plus
      {{$t('BUTTONS.New')}}
    
  
  

    
      

      
    

  


  
    

    
    

    
  



.phone-book-active-item{
    background-color: rgba(255 , 255 , 255 , 0.2);
  }

  • 对我来说,您似乎在其中一个端口上缩放了浏览器。
  • 确保您在开发和生产模式下使用相同的屏幕尺寸和浏览器缩放。另外请确保在开发和生产模式下您使用的是包含所有代码的相同版本。

【解决方案1】:

只需在文件 vue.config.js 的 css 部分添加 extract:false

例如

  css: {
    loaderOptions: {
     ...
     ..
     .
    },
    extract:false
  },

【讨论】: