需要安装的插件:

cnpm i -D babel-core babel-loader babel-plugin-syntax-jsx babel-plugin-transform-runtime  babel-plugin-transform-vue-jsx babel-preset-env babel-preset-stage-2

直接安装的babel-loader是8.0的需要降到7.0,babel-core6.0需要babel-laoder7.0进行匹配;
.babelrc配置文件:
  1. {
  2. "presets": [
  3. ["env", {
  4. "modules": false,
  5. "targets": {
  6. "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
  7. }
  8. }],
  9. "stage-2"
  10. ],
  11. "plugins": ["transform-vue-jsx", "transform-runtime"]

webpack的配置文件中module-rules中加入:

  1. {
  2. test: /\.js$/,
  3. exclude: /(node_modules|bower_components)/,
  4. loader: 'babel-loader'
  5. }

webpack配置babel-loader的更多相关文章

  1. webpack配置常用loader加载器

    webapck中使用loader的方法有三种 使用loader之前必须运行安装 : npm install --save-dev xxx-loader (1)通过CLI : 命令行中运行 webpac ...

  2. webpack配置babel篇

    babel-polyfill & babel-runtime & babel-preset-env babel-core babel-core 的作用是把 js 代码分析成 ast , ...

  3. webpack中babel配置 --- runtime-transform和babel-pollfill

    webpack - babel配置 babel是一个javascript编译器,是前端开发中的一个利器.它突破了浏览器实现es标准的限制,使我们在开发中可以使用最新的javascript语法. 通过构 ...

  4. Webpack的详细配置,[Webpack中各种loader的安装配置]

    在使用webpack的时候,你是不是被以下这种报错所困扰: 注意看 黄色框中标注的 You may need an appropriate loader to handle this file typ ...

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

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

  6. 17 webpack中babel的配置

    在webpack中,默认只能处理一部分ES6的新语法,一些更高级的ES6语法或者ES7语法, webpack是处理不了的:这时候,就需要借助于第三方的loader,来帮助webpack处理这些高级的语 ...

  7. [webpack] 配置react+es6开发环境

    写在前面 每次开新项目都要重新安装需要的包,简单记录一下. 以下仅包含最简单的功能: 编译react 编译es6 打包src中入口文件index.js至dist webpack配置react+es6开 ...

  8. Webpack配置示例和详细说明

    /* * 请使用最新版本nodejs * 默认配置,是按生产环境的要求设置,也就是使用 webpack -p 命令就可以生成正式上线版本. * 也可以使用 webpack -d -w 命令,生成用于开 ...

  9. vue-cli#2.0 webpack 配置分析

    目录结构: ├── README.md ├── build │ ├── build.js │ ├── check-versions.js │ ├── dev-client.js │ ├── dev-s ...

  10. webpack配置这一篇就够

    最近看了一篇好文,根据这个文章重新梳理了一遍webpack打包过程,以前的一些问题也都清楚了,在这里分享一下,同时自己也做了一些小的调整 原文链接:http://www.jianshu.com/p/4 ...

随机推荐

  1. Openwrt路由器上常用的操作

    换了好些固件,大体上都差不多. 只能用opkg下载安装,不能用apt-get安装. 1.tcpdump和nano是我必备的,个人觉得nano比vi好用 opkg install tcpdump opk ...

  2. SVN “Previous operation has not finished”

    https://jingyan.baidu.com/article/cbcede0761334902f40b4d31.html 需要运行sqlite3打开.svn下的wc.db数据库文件, sqlit ...

  3. AJAX备忘

    基础 AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML). AJAX 不是新的编程语言,而是一种使用现有标准的新方法. AJAX ...

  4. ELK实践

    一.ElasticSearch+FileBeat+Kibana搭建平台 在C# 里面运行程序,输出日志(xxx.log 文本文件)到FileBeat配置的路径下面. 平台搭建,参考之前的随笔. Fil ...

  5. /etc/shells

    List of acceptable shells for chpass(1). Ftpd will not allow users to connect who are not using one ...

  6. Comet OJ Contest #13 简要题解

    C2 首先用并查集维护\(1\)的连通块,然后用另外一个并查集维护第\(i\)行中,第\(j\)列之后的第一个\(0\)的位置,就是如果当前位置是\(1\)那么它的父亲是它右边的格子,否则是它自己. ...

  7. (3)Angular的开发

    Angular CLI是一个命令行界面工具 创建项目.添加文件以及执行一大堆开发任务,比如测试.打包和发布 Angular CLI 功能与常用参数 使用Angular CLI 高效构建angular ...

  8. @RestController和@GetMapping

    @RestController 可以代替@Controller使用,使用了@RestController的控制器默认所有请求方法都用了@ResponseBody注解. @GetMapping(&quo ...

  9. SVN版本回滚实战

    天在使用SVN发布的时候不小心修改了一些不正确的东西,新增和编辑了一些错误的文件,由于文件数量比较多,并且目录复杂,不可能单个进行处理,所以想到了SVN版本回滚. 回滚本地工作目录: 1.右键工作目录 ...

  10. 和小哥哥一起刷洛谷(7) 图论之dijkistra算法

    关于dijkstra 维基百科 戴克斯特拉算法(英语:Dijkstra's algorithm,又译迪杰斯特拉算法)由荷兰计算机科学家艾兹赫尔·戴克斯特拉在1956年提出.戴克斯特拉算法使用了广度优先 ...