vue2-preview 生产环境打包报错

最新推荐文章于 2025-08-06 10:32:44 发布

原创

最新推荐文章于 2025-08-06 10:32:44 发布 · 2k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue #vue2-preview

在Vue项目中使用vue2-preview插件时，遇到npm run build生产环境打包失败的问题，原因是webpack的babel-loader配置未转换node_modules中的ES6语法。解决方案包括直接修改vue2-preview的源码或调整babel-loader配置，避免排除node_modules并明确包含相关模块。

情况：vue项目里使用了vue2-preview插件，但是在npm run build的时候打包报错

原因：因为vue2-preview插件里使用了ES6的语法，而我的webpack的babel-loader配置把node_modules文件下的代码除外了

 {
    test: /\.js$/,
    use: 'babel-loader',
    exclude: /node_modules/
 },

所以生产环境下打包遇到ES6语法报错。

解决办法一： 修改vue2-preview插件的源码，打开node_modules文件夹找到vue2-preview,修改index.js文件

import Vue2Preview from './preview.vue'

export default {
  install(Vue, options) {     // 这一行修改为 install: function(Vue, options) {
    Vue.mixin({
      components: {
        'vue-preview': Vue2Preview
      }
    })
  }
}

解决办法二： 修改babel-loader的配置，删掉exclude那一行，添加include那一行