最新版安装与普通安装

使用babel-loader编译ES6,需要遵循规范,安装babel-presets

规范列表

对应babel-loader,babel-preset安装最新版和普通版:

presets算是loader的参数,如何指定参数?

babel-presets也有一个参数就是targets,这个参数告诉babel当你编译时,根据你指定的targets选择哪些语法编译,哪些语法不编译

可以看出下图的includes方法和set都没有编译,这是因为一些低版本浏览器中不存在

babel-presets针对编译的是语法,要想使得这些函数与方法也被编译,就要用到babel的两个插件

1.babel ployfilll

2.babel runtime transform

局部垫片使用,新建.babelrc文件:

webpack.config.js改成:

由于babel-runtime不是最新版本重新安装

前端工程化-webpack(babel编译ES6)的更多相关文章

  1. 使用webpack+babel构建ES6语法运行环境

    1.前言 由于ES6语法在各个浏览器上支持的情况各不相同,有的浏览器对ES6语法支持度较高,而有的浏览器支持较低,所以为了能够兼容大多数浏览器,我们在使用ES6语法时需要使用babel编译器将代码中的 ...

  2. webpack如何编译ES6打包

    前言:随着ES的普及我们越来越多的开始使用ES6的语法了,当然也随着mvvm框架的流行少不了js模块化,那js模块化又有那些呢 在很早的时候大家都用的命名空间,现在也有人用(库名.类别名.方法名) 后 ...

  3. 使用babel编译es6

    起因:开发中慢慢的学习使用es6,但是JavaScript需要浏览器来解析,而不是所有浏览器都支持es6,所以为了兼容es6,需要第三方工具进行编译es6. 工具:node,gulp,gulp-bab ...

  4. 前端工程化 Webpack基础

    前端工程化 模块化 (js模块化,css模块化,其他资源模块化) 组件化 (复用现有的UI结构.样式.行为) 规范化 (目录结构的划分.编码规范化.接口规范化.文档规范化.Git分支管理) 自动化 ( ...

  5. 在IDEA(phpStorm)中使用Babel编译ES6

    安装Babel 官方文档建议我们根据单个项目进行本地安装,原因是不同的项目可以依赖不同版本的 Babel,使你的项目更方便移植.更易于安装. 在项目的根目录下使用命令行工具(CMD等)执行下面代码 n ...

  6. 前端工程化-webpack篇之babel-polyfill与babel-runtime(三)

    关于 Babel 如果我们没有配置一些规则,Babel 默认只转换新的 JavaScript 句法(syntax),而不转换新的 API,比如 Iterator.Generator.Set.Maps. ...

  7. 前端工程化webpack(一)

    webpack 的基本用法   1.app.js 引入模块 import moduleLog from './module.js' //引入moduleLog从./module.js 2.module ...

  8. 前端工程化-webpack(打包JS)(二)

    一.第一种打包方式 webpack entry<entry> output 假设目录结构如下: index.html是入口文件 打包app.js为bundle.js如下 app.js 当使 ...

  9. 前端工程化-webpack简介(一)

    本质上,webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler).当 webpack 处理应用程序时,它会递归地构建一个依赖关系图(dependenc ...

随机推荐

  1. java连接mysql的过程

    今天突然心血来潮,想要用java连接mysql,记得以前是在vs2010的环境下用C#连接sql sever,其实他们的方法都差不多. 现在就可以简单的介绍下java如何连接mysql 第一步,设计m ...

  2. Django多域名配置之Django-hosts插件的使用

    使用场景: Django中有两个app,如果通过域名来访问,可以使用www.domain.com/a.www.domain.com/b来访问.这样就显得有点LowB了.如果我想通过a.domain.c ...

  3. Date对象常用方法

    年月日: var oDate = new Date() //年 oDate.getFullYear(); //月 返回的月份要+1才正常 oDate.getMonth()+1: //日 oDate.g ...

  4. yolov2-tiny-voc.cfg 参数解析

    一.参数解析 [net] batch=64 # number of images pushed with a forward pass through the network subdivisions ...

  5. Java基础-考察JVM内部结构的常用工具介绍

    Java基础-考察JVM内部结构的常用工具介绍 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 我们可以通过jvisualvm.exe考察jvm内部结构.而jvisualvm.exe ...

  6. Nginx 学习笔记(三)proxy_cache 缓存配置和ngx_cache_purge模块

    反向代理的缓存清理 一.proxy_cache配置 (1)如何配置和安装,都在这里了:https://github.com/Tinywan/Lua-Nginx-Redis/blob/master/Ng ...

  7. JAVA Socket 编程---Socket 和 ServerSocket

    一,Socket Socket的选项 1) TCP_NODELAY:默认值为false.表示采用Negale算法.当设置为true时,表示关闭Socket缓冲,立即发送数据. Socket默认发送数据 ...

  8. 电脑爱好——PE系统分区工具 分区时函数错误,报000000001错误 解决方法

    1.启动硬盘分区软件diskgenius(一般都是这个分区软件,这个PE系统自带的居多) 2.将现有的分区全部删掉 3.选择菜单栏——“硬盘”——“转换分区表类型为MBR格式”——转换完成 4.快速分 ...

  9. sql 分页row_number() over(order by key)

    select * from ( select row_number() over(order by BD008_001) as row ,* from (select * from bd008)t ) ...

  10. c# 匿名函数

    int t(){    Func<int> m=()=>3;    return m()+m();}