声明:文章转自https://www.cnblogs.com/ye-hcj/p/7070084.html

本文介绍一个babel转码神器babel-preset-env

  1. 简介

    现如今不同的浏览器和平台chrome, opera, edge, firefox, safari, ie, ios, android, node, electron
    不同的模块 "amd" , "umd" , "systemjs" , "commonjs"
    这些es运行环境对es6,es7,es8支持不一,有的支持好,有的支持差,为了充分发挥新版es的特性,我们需要在特定的平台上执行特定的
    转码规则,说白了就像是按需转码的意思
  2. 安装

    npm install --save-dev babel-preset-env
  3. 使用

    1.在babel配置文件中
    {
    "presets": ["env"]
    }
    上面这个配置的作用和babel-prset-latest的作用一致也就是下面这个配置
    {
    "presets": ["latest"]
    }
    2.babel-preset-env可以设置一些选项,这里就介绍几种,有兴趣自己去看英文文档
    targets 指定运行环境
    targets.node 指定node版本
    targets.browsers 指定浏览器版本
    modules 指定何种形式的模块,设置为false表示不转码模块
    具体配置书写方式如下
    {
    "presets": [
    ["env",{
    "targets": {
    "chrome": 52,
    "browsers": ["last 2 versions","safari 7"]
    }
    }]
    ]
    }
 

babel-preset-env使用介绍的更多相关文章

  1. Error: Couldn't find preset "env" relative to directory "/Users/user/ethereumjs-vm"

    运行npm run build时遇见这个问题,解决办法是安装: npm install --save-dev babel-preset-env 就解决了

  2. vue客户端渲染首屏优化之道

    提取第三方库,缓存,减少打包体积 1. dll动态链接库, 使用DllPlugin DllReferencePlugin,将第三方库提取出来另外打包出来,然后动态引入html.可以提高打包速度和缓存第 ...

  3. babel-preset-env: a preset that configures Babel for you

    转载 babel-preset-env is a new preset that lets you specify an environment and automatically enables t ...

  4. 《前端之路》之 Babel 下一代 JavaScript 语法编译器

    写本章的内容的出发点主要是 为了对于之前关于 JS 版本的一个总结,在之前的开发中,我们始终对于 ECMAScript 的版本的更新不够重视,以至于在后面的 开发过程中,我们始终会被各种新奇的语法打断 ...

  5. WebStorm ES6 语法支持设置&babel使用及自动编译

    一.语法支持设置 Preferences > Languages & Frameworks > JavaScript 二.Babel安装 1.全局安装 npm install -g ...

  6. JavaScript ECMAScript版本介绍

    1. 介绍 1.1 什么是ECMAScript ECMAScript,简称ES,是由Ecma国际(前身为欧洲计算机制造商协会,英文名称是European Computer Manufacturers ...

  7. babel基本用法

    babel-cli babel-cli是本地使用编译js文件 1.安装: cnpm i babel-cli babel-preset-env -D 2.配置packjson: "script ...

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

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

  9. Babel总结

    什么是babel? babel是一个JavaScript编译器. Babel是一个工具链,主要用于将ECMAScript 2015+代码转换为向后兼容的旧浏览器或环境中JavaScript版本. 注解 ...

  10. vue - Babel之babel-polyfill、babel-runtime、transform-runtime

    引言 babel默认只转换新的 JavaScript 语法,比如箭头函数.扩展运算(spread). 不转换新的 API,例如Iterator.Generator.Set.Maps.Proxy.Ref ...

随机推荐

  1. 同一个脚本在SQLPLUS和SQLDEV上的不同

    前几天收集了信息给Oracle.oracle那边表示格式不正确.让我又一次收集.我非常费解,我是依照官方文档做的呀,怎么会? 于是我果断自己搭了一个环境:RHEL5.8+10.2.0.5 客户那边没法 ...

  2. Django TemplateDoesNotExist

    在联系Django的时候,启动正常,我在浏览器上输入URL地址后报错 TemplateDoesNotExist at /test/ 解决方案 默认这里是空的,这里我们填上我们静态文件的地址

  3. 基于vue-cli项目添加服务端渲染

    两个示例的git地址: 1. 我的环境 2. 方式一:使用prerender-spa-plugin插件获得SSR的效果. 2.1 说明 2.2 初始化 1 vue init webpack vue-p ...

  4. 【Big Data - Hadoop - MapReduce】初学Hadoop之图解MapReduce与WordCount示例分析

    Hadoop的框架最核心的设计就是:HDFS和MapReduce.HDFS为海量的数据提供了存储,MapReduce则为海量的数据提供了计算. HDFS是Google File System(GFS) ...

  5. IntelliJ IDEA 中文乱码配置

    总共有下面几种乱码的解决方案: 工程乱码 执行main函数时,控制台乱码 运行tomcat时,控制台乱码 PS: 如果下面方案不生效时,打开IDEA安装目录找到 idea.exe.vmoptions( ...

  6. 【转】WPF自定义控件与样式(2)-自定义按钮FButton

    一.前言.效果图 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等 还是先看看效果图吧:   定义Button按钮名称叫FButton,主要是集成了 ...

  7. Nginx系列二:(Nginx Rewrite 规则、Nginx 防盗链、Nginx 动静分离、Nginx+keepalived 实现高可用)

    一.Nginx Rewrite 规则 1. Nginx rewrite规则 Rewrite规则含义就是某个URL重写成特定的URL(类似于Redirect),从某种意义上说为了美观或者对搜索引擎友好, ...

  8. Angular4学习笔记(六)- Input和Output

    概述 Angular中的输入输出是通过注解@Input和@Output来标识,它位于组件控制器的属性上方. 输入输出针对的对象是父子组件. 演示 Input 新建项目connInComponents: ...

  9. linux:rsync + inotifywait 实现【准实时】同步

    直接上脚本 #!/bin/bash export PATH=./sbin:/bin:/usr/sbin:/usr/bin:/usr/local/bin:$PATH src=/tmp1 #dest=ro ...

  10. 【QT】QT下载与安装

    很简单 1.下载地址 http://download.qt.io/archive/qt/ 学个单词,archive. 选择一个版本下载,5.9.3. 2.安装 选择组件 MinGW就行了,MinGW- ...