项目内部已经有了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. 为Vue.js添加友好日志

    const isDebugEnabled = process.env.NODE_ENV !== "production"; const isInfoEnabled = true; ...

  2. 关于parseInt()里的一些小坑

    parseInt(string,radix)方法是将输入字符串转化为数值,两个输入参数中string为要转化的字符串,radix可省略,是浏览器以几进制来解读输入的string. 举几个例子就能够对该 ...

  3. python操作mysql数据-执行语句返回值直接返回字典类型

    fetchall()将结果放在二维数组里面,每一行的结果在元组里面 import pymysql def export(table_name): conn =pymysql.connect(host ...

  4. numpy(一)

    np.zeros(10,dtype=int) #创建全为0的一位数组 np.ones((3,5),dtype=float) #创建3*5的二维全为1的数组 np.full((3,5),3.14) #创 ...

  5. OO第二单元总结(多线程的电梯调度)

    经过第一单元作业的训练,在做第二单元的作业的时候,要更加的有条理.但是第二次作业多线程的运行,带来了更多的运行的不确定性.呈现出来就是程序会出现由于线程安全问题带来的不可复现的bug.本单元的作业也让 ...

  6. #WEB安全基础 : HTTP协议 | 0x9 GET和POST请求以及请求URI的方式

    请求URI的方式 1.URI为完整的请求URI GET http://hackr.jp/index.htm HTTP/1.1 2.在首部字段Host中写明域名或IP地址 GET/index.htm H ...

  7. JDK8 BigDecimal API-创建BigDecimal源码浅析二

    第二篇,慢慢来 根据指数调整有效小数位数 // 上一篇由字符串创建BigDecimal代码中,有部分代码没有给出,这次补上 // 这个是当解析字符数组时存在有效指数时调整有小小数位数方法 privat ...

  8. java:tomcat(负载均衡)nginx的应用配置

    http://mini.eastday.com/mobile/180627012211514.html 1.什么是负载均衡 由于系统各个核心部分随着业务量的提高,访问量和数据流量的快速增长,单一的服务 ...

  9. 2017-2018-2 20155228 《网络对抗技术》 实验三:MAL_免杀原理与实践

    2017-2018-2 20155228 <网络对抗技术> 实验三:MAL_免杀原理与实践 实验内容 正确使用msf编码器,msfvenom生成如jar之类的其他文件,veil-evasi ...

  10. px和em的区别, css权重

    PX特点:px像素(Pixel).相对长度单位.像素px是相对于显示器屏幕分辨率而言的. EM特点 1. em的值并不是固定的:2. em会继承父级元素的字体大小. 优先级:!important> ...