项目内部已经有了babel的配置文件babel.config.js

module.exports = {
presets: ["@vue/app"],
};

然后由于要按需引入element-ui,就使用了babel-plugin-component,并且配置了.babelrc文件,如下(当然其中涉及到babel7,大家要安装@babel/preset-env,旧的babel-perset-es2015在babel7已经不支持了)

{
"presets": [["@babel/preset-env", { "modules": false }]],
"plugins": [
[
"component",
{
"libraryName": "element-ui",
"styleLibraryName": "theme-chalk"
}
]
]
}

然后发现页面中element-ui的按需引入没有生效,这就奇怪了,后来找了很多问题,发现原来是配置无法合并的问题,导致.babelrc文件的配置根本就没有生效。于是把配置放到了同一个文件就好了,

记得删除另外一份文件(babel.config.js)只保留一个配置文件(.babelrc)。

{
"presets": ["@vue/app", ["@babel/preset-env", { "modules": false }]],
"plugins": [
[
"component",
{
"libraryName": "element-ui",
"styleLibraryName": "theme-chalk"
}
]
]
}

这样就没问题了

.babelrc和babel.config.js的相同配置不能合并的更多相关文章

  1. 关于vue.config.js 的 proxy 配置

    关于vue.config.js 的 proxy 配置有的同学不怎么明白项目里面有的配置了 pathRewrite 地址重写,有的又没有进行配置?/* * proxy代理配置的说明 * *接口例子:/z ...

  2. [转] 如何写好.babelrc?Babel的presets和plugins配置解析

    什么是Babel The compiler for writing next generation JavaScript. 官网是这么说的,翻译一下就是下一代JavaScript 语法的编译器. 作为 ...

  3. 如何写好.babelrc?Babel的presets和plugins配置解析

    什么是Babel The compiler for writing next generation JavaScript. 官网是这么说的,翻译一下就是下一代JavaScript 语法的编译器. 作为 ...

  4. vue.config.js的常用配置

    const path = require('path') const glob = require('glob') const resolve = (dir) => path.join(__di ...

  5. vue-cli 3.x搭建项目以及其中vue.config.js文件的配置

    参考链接:https://www.cnblogs.com/wxh0929/p/11271551.html vue-cli3全面配置详解:https://www.jb51.net/article/150 ...

  6. 关于 vue.config.js 文件的配置

    相关文档: https://cli.vuejs.org/zh/config/#vue-config-js

  7. postcss.config.js配置文件的配置方法

    module.exports = { plugins: { 'autoprefixer': {}, } }

  8. webpack.config.js====配置babel

    参考:https://www.jianshu.com/p/9808f550c6a91. 安装依赖babel-loader: 负责 es6 语法转化babel-preset-env: 包含 es6.7 ...

  9. 关于自己配置有关webpack.config.js和vue项目搭建相关步骤

    ## Webpack的配置和使用 ### 安装 1. 全局安装 ``` npm install webpack -g ``` 2. 本地安装 ``` npm install webpack -D `` ...

随机推荐

  1. 《Redis 使用规范》

    一:Redis 概述 - Redis 是内存级别的数据库,在一台普通电脑上,Redis 3.X 便可以读取 10 万个键值对(现在的Redis官方版本已经更新到了5.X,性能会更好). 二:关于Red ...

  2. 使用STS创建springboot项目pom.xml文件报错org.apache.maven.archiver.MavenArchiver.getManifest

    首先我的STS版本时:3.7.3 解决办法:->help->Install New Software -> add->location ->输入: http://repo ...

  3. python练习题-day24

    1.单继承 class Animal: def __init__(self,name,hp,aggr): self.name=name self.hp=hp self.aggr=aggr def ea ...

  4. Oracle中exp导出与imp导入的参数(full,owner/formuser/touser)测试

    1.exp导出的参数(FULL,OWNER)测试 先知道的一点是full不能与owner共存,还有都是以用户的方式导出(在这里),其中不仅仅包括表,这可能就是下面报warnings的原因,因为Orac ...

  5. Oracle 12C执行root.sh CLSRSC-119 CRS-8503 CLSRSC-366

    1.环境 OS:SUSE Linux Enterprise 12 SP3 X86_64 (Kernel: 4.4.162-94.69.2) DB:12.2.0.1 两节点RAC 参考文档:在 SLES ...

  6. Cocos Creator 生命周期回调(官方文档摘录)

    Cocos Creator 为组件脚本提供了生命周期的回调函数.用户通过定义特定的函数回调在特定的时期编写相关 脚本.目前提供给用户的声明周期回调函数有: onLoad start update la ...

  7. 关于eclipse常用的一些快捷键

    Ctrl+Alt+H :查看方法被哪些代码调用了 Ctrl + Shif +O :自动引导类包 Ctrl+Shift+/     : 加上段注释 Ctrl+Shift+\  : 取消段注释 ALT+/ ...

  8. 查找字符在字符串中第N次出现的位置

      1.查找字符串 @find 在字符串 @str 中第 (@n) 次出现的位置.没有第 (@n) 次返回 0. 返回@find在@str中第(@n)次出现的位置.没有第(@n)次返回0. ), ), ...

  9. MATLAB 通过对话框返回值选择下一步操作

    学习来源:http://muchong.com/t-10428977-1-pid-1 Userchoice = questdlg(['您确定导入彩色图像?'],'提示','转为灰度图处理','展示彩色 ...

  10. GET和POST两种基本请求方法(转自博主--在途中#)

    GET和POST两种基本请求方法的区别 GET和POST是HTTP请求的两种基本方法,要说它们的区别,接触过WEB开发的人都能说出一二. 最直观的区别就是GET把参数包含在URL中,POST通过req ...