08335 / hivui-platform-template
hivui平台项目模板
Newer
Older
hivui-platform-template / babel.config.js
caibinghong on 6 Oct 2021 add
//vite 启动,与webpack 编译都能识别这个 process.env.NODE_ENV
// console.log('babel.config.js    process.env.NODE_ENV:', process.env.NODE_ENV)
let config = {
    "presets": [["es2015", { "modules": false }]],
    "plugins": [
      [
        "component",
        {
          "libraryName": "element-ui",
          "styleLibraryName": "theme-chalk"
        }
      ]
    ]
};// 默认vite 预览不做任何配置 ,否则有影响vite 对jsx 预览
if (process.env.NODE_ENV == "production") {
    config = {
        "presets": [
            "@vue/babel-preset-jsx",
            [
                //做语法转换,并注入函数
                //1、存在每个js 文件都注入函数使文件体积变大
                "@babel/preset-env"
            ]
        ],
        "plugins": [
            "babel-plugin-transform-vite-meta-env",//转换环境变量,vite几个参数同步到webpack编译中
            "@vue/babel-plugin-transform-vue-jsx",//打包jsx 写的vue 组件
            [
                //2、配置这个插件,并通过@babel/runtime 库来解决 1 的问题 ,将注入的转为包的引用 解决了代码复用和最终文件体积大的问题
                //3、@babel/runtime 里存放的是Babel做语法转换的辅助函数 ,进化版@babel/runtime-corejs3 除了包含Babel做语法转换的辅助函数,也包含了core-js的API转换函数
                //4、 解决1的问题 ,那么2也存在问题会影响原window下的核心api,这样污染环境。因此此插件的corejs3解决这个问题,但并引用@babel/runtime-corejs3
                "@babel/plugin-transform-runtime",
                {
                    "corejs": 3 // 指定 runtime-corejs 的版本,目前有 2 3 两个版本
                }
            ],
            [
                "component",
                {
                    "libraryName": "hi-ui",//按需引用,不用时要去掉这个配置
                    "style": false,//不需要加载css
                    // "camel2Dash": false//不需要驼峰转换成 -
                }
            ]
        ]
    }
}
module.exports = config;