babel:将浏览器不支持的ES6语法转为javascript

查看node是否安装:

    npm -v
node -v

实例演示:
在桌面新建part5目录
在cmd命令行中

    cd desktop
cd part5

安装babel:
初始化package.json文件:描述当前项目信息,包括依赖等

    npm init

安装babel cli

    npm install --save-dev babel-cli

在package.json的"script"下添加一句:

    "build": "babel entry.js"

创建entry.js文件,写es6代码用于测试

执行

npm run build

全局安装babel-cli

    npm i babel-cli -g

安装babel-preset-env

    npm i -D babel-preset-env

创建配置文件,告诉babel用什么规则来编译文件.babelrc

{
"presets": [
[
"env",
{
"targets":{
"browsers":["last 1 version"]
}
}
]
]
}

修改packsge.json
-o 输出到文件
-w 始终处于监听状态

"build": "babel entry.js -o index.js -w"

通过babel插件体验新特性
安装插件

npm i -D babel-plugin-transform-class-properties

修改.babelrc文件

{
"presets": [
[
"env",
{
"targets":{
"browsers":["last 1 version"]
}
}
]
],
"plugins":["transform-class-properties"]
}

babel环境安装与编译的更多相关文章

  1. 安装maven编译环境

    安装maven编译环境 1.默认已经装好yum并配置好yum源(推荐使用163yum源) 2.安装JDK 3.安装相关依赖环境(root用户登陆) yum install -y cmake lzo-d ...

  2. CentOS离线安装GCC编译环境

    gcc编译环境rpm下载 安装相关的rpm包,具体版本可能随时间变化而变化,可以去以下地址下载: 重庆大学镜像:http://b.mirrors.lanunion.org/CentOS/中国科学技术大 ...

  3. centos6.5环境源码编译安装mysql5.6.34

    centos6.5环境源码编译安装mysql5.6.34 源码下载地址http://dev.mysql.com/downloads/mysql/5.6.html#downloads 选择Generic ...

  4. WebStorm 8.0安装LESS编译环境的教程

    WebStorm是一个非常棒的Web前端开发编辑器,被程序猿们成为“最智能的JavaScript IDE”.对HTML5.Bootstrap框架.Node.js等都有完美支持.目前最新版本为WebSt ...

  5. 【转】Android 4.3源码的下载和编译环境的安装及编译

    原文网址:http://jingyan.baidu.com/article/c85b7a641200e0003bac95a3.html  告诉windows用户一个不好的消息,windows环境下没法 ...

  6. Linux Object-C 编译环境安装

    sudo apt-get install gnustep sudo apt-get install gnustep-devel sudo apt-get install gobjc . /usr/sh ...

  7. Linux本地yum源配置以及使用yum源安装gcc编译环境

    本文档是图文安装本地yum源的教程,以安装gcc编译环境为例. 适用范围:所有的cetos,红帽,fedroa版本 适用人群:有一点linux基础的小白 范例系统版本:CentOS Linux rel ...

  8. Tesseract环境搭建及编译安装

    Tesseract环境搭建及编译安装 Tesseract源码都是C++源码:对于不咋会C++的人来说,这真是...虽然说语言有相通性,但是...哎!!!!! 分享出来,也希望对大家有所帮助. 环境:w ...

  9. android编译环境安装

    Android 编译环境安装 安装 Java 6 安装 Java 6 安装依赖包 (Ubuntu 12.04) $ sudo apt-get install git gnupg flex bison ...

随机推荐

  1. 11g与12c启动,关闭RAC

    oracle11g 关闭,启动顺序 1.关闭数据库(oracle)srvctl stop database -d rac 2.关闭集群(root)crsctl stop cluster -all 3. ...

  2. 【Java并发工具类】StampedLock:比读写锁更快的锁

    前言 ReadWriteLock适用于读多写少的场景,允许多个线程同时读取共享变量.但在读多写少的场景中,还有更快的技术方案.在Java 1.8中, 提供了StampedLock锁,它的性能就比读写锁 ...

  3. Ubuntu18 永久设置分辨率1920x1080

    起因 虚拟机(virtualBox)中设置 1920*1080 的分辨率后, 每次重启后都会回到默认,永久设置的方式如下 步骤: 添加系统设置 sudo xrandr --newmode " ...

  4. Thread类的interrupted方法和isInterrupted方法的区别

    如下所示,interrupted()会改变线程的中断状态(清除),而isInterrupted()不影响线程的中断状态   /** * Tests whether the current thread ...

  5. 详解CopyOnWrite容器及其源码

    详解CopyOnWrite容器及其源码 在jave.util.concurrent包下有这样两个类:CopyOnWriteArrayList和CopyOnWriteArraySet.其中利用到了Cop ...

  6. JVM源码分析之临门一脚的OutOfMemoryError完全解读

    概述 OutOfMemoryError,说的是java.lang.OutOfMemoryError,是JDK里自带的异常,顾名思义,说的就是内存溢出,当我们的系统内存严重不足的时候就会抛出这个异常(P ...

  7. React之深入了解虚拟DOM

    JS在手机中也可运行,React Native通过将虚拟DOM转换为底层的原生组件,即可在手机端运行,在浏览器运行时,只需要将虚拟DOM转换为真实DOM即可运行,虚拟DOM就是将真实DOM转换为JS对 ...

  8. vue-cli项目引入jquery和bootstrap

    1.安装插件 npm install jquery --save npm install bootstrap --save npm install popper.js --save //提示框插件,b ...

  9. 用C语言实现中国象棋

    基于五子棋框架上的 象棋 小游戏 本游戏是上各种水课无聊时的产物...不参考现有游戏从零开始实现各项功能. 游戏配置:二维数组,循环系统,wasd基本移动,调整窗台的函数,以及富足的发呆时间.. 完整 ...

  10. PHP常见代码执行后门函数

    PHP常见代码执行后门函数 代码执行: 应用程序在调用一些能够将字符串转换为代码的函数(例如php中的eval中),没有考虑用户是否控制这个字符串,将造成代码执行漏洞. 常见php代码执行函数介绍 常 ...