vue3.0开发总结-填坑

1.vue3.0配置第三方插件不打包

配置第三方插件不打包采用cdn引入是比较常见的减小包体积的办法,因为第三方插件最终打包都会打包到vendor.js中,这就导致了包的体积比较大

对比
打包前:chunk-vendor.js 911kb,还有一个包也有九百多估计也是第三方插件导致的
打包后:chunk-vendor.js 147kb
但是:cdn引入的话需要开率cdn如果出问题项目就崩了,有时候我们也会把文件下载到本地然后本地引入,这样的话就相当于把大文件拆成很多小文件了,

• vue.config.js

 externals: {
      vue: 'Vue',
      echarts: 'echarts',
      lodash: '_',
      'element-plus': 'ElementPlus'
    },

html

2.升级element-plus版本

原先版本：1.0.2-beta.65
新版本：^1.2.0-beta.3
按照官网提供的步骤
npm uni element-plus
npm uni babel-plugin-import

npm i element-plus
npm i unplugin-vue-components // 按需引入的插件

结果运行之后发现一堆报错
然后需要修改vue.config.js配置文件
新增下面的配置

 module: {
   rules: [
    {
     test: /\.mjs$/,
     include: /node_modules/,
     type: 'javascript/auto'
    }
   ]
  },

然后就可以了