安装es6编译babel
1、它的安装命令如下。
全局安装 :$ npm install --global babel-cli
项目下安装: $ npm install -g babel-cli --save-dev
2、配置.babelrc文件
这个文件配置的是编译es6的规则,配置如下:
{
"presets": [
"es2015",
"react",
"stage-2"
],
"plugins": []
}
3、转码规则:
# 转码结果输出到标准输出
$ babel example.js # 转码结果写入一个文件
# --out-file 或 -o 参数指定输出文件
$ babel example.js --out-file compiled.js
# 或者
$ babel example.js -o compiled.js # 整个目录转码
# --out-dir 或 -d 参数指定输出目录
$ babel src --out-dir lib
# 或者
$ babel src -d lib # -s 参数生成source map文件
$ babel src -d lib -s 实时监测es6文件
babel ECAMscript2015.js --watch -o ECAMscript20151.js
上面代码是在全局环境下,进行 Babel 转码。这意味着,如果项目要运行,全局环境必须有 Babel,也就是说项目产生了对环境的依赖。另一方面,这样做也无法支持不同项目使用不同版本的 Babel。
4、用npm init 创建package.json,修改其配置如下:
{
"name": "es6",
"version": "1.0.0",
"description": "",
"main": "index.js",
"devDependencies": {
"babel-cli": "^6.0.0"
},
"scripts": {
"build": "babel src -d lib"
},
"author": "",
"license": "ISC"
}
5、执行
$ npm run build
就能转译啦
安装es6编译babel的更多相关文章
- 使用babel将ES6编译成ES5
现在ES6已经非常成熟了,我的需求很明确,就是只需要将ES6编译成ES5. 项目目录为 借鉴的博客链接为https://blog.csdn.net/suwu150/article/details/77 ...
- 使用nuxt.js官方脚手架构建项目时ES6编译问题SyntaxError: Unexpected token import
用nuxt集成koa2做vue后台,官方自带脚手架搭建的koa2仍是ES5语法,在构建koa2时默认的nodemon是没有使用babel编译的, 所以首先需要在启动命令后加上--exec babel- ...
- 深入浅出 ES6:ES6 与 Babel / Broccoli 的联用
深入浅出 ES6指的是添加在 ECMASript 标准第六版中的 JavaScript 编程语言的新特性,简称为 ES6. 虽然 ES6 刚刚到来,但是人们已经开始谈论 ES7 了,它未来的样子,以及 ...
- Typescript 学习笔记一:介绍、安装、编译
前言 整理了一下 Typescript 的学习笔记,方便后期遗忘某个知识点的时候,快速回忆. 为了避免凌乱,用 gitbook 结合 marketdown 整理的. github地址是:ts-gitb ...
- 安装maven编译环境
安装maven编译环境 1.默认已经装好yum并配置好yum源(推荐使用163yum源) 2.安装JDK 3.安装相关依赖环境(root用户登陆) yum install -y cmake lzo-d ...
- CentOS离线安装GCC编译环境
gcc编译环境rpm下载 安装相关的rpm包,具体版本可能随时间变化而变化,可以去以下地址下载: 重庆大学镜像:http://b.mirrors.lanunion.org/CentOS/中国科学技术大 ...
- windows平台下安装、编译、使用mongodb C++ driver
本博客将记录在Win8.1 ,VS2013环境下编译.配置mongodb C++ driver的流程. 1.下载预备 下载Boost:http://sourceforge.net/projects/b ...
- eclipse安装反编译工具
身为一名程序员来说,日常最常做的就是编写代码和查看别人写好的源代码了,有时候打开别人写的class文件发现根本不是自己想要的,所以给大家介绍一种eclipse中反编译class文件的工具. 第一步:下 ...
- [转]Caffe在Linux下的安装,编译,实验
Caffe在Linux下的安装,编译,实验 原文地址:http://www.cnblogs.com/evansyang/p/6150118.html 第一部分:Caffe 简介 caffe是有伯克利 ...
随机推荐
- Ext.Net的一例Ext Undefined解决办法
在运行的产品里发现了一例Ext Undefined报错.经过仔细排查原因是一个Ext.net按钮控件前端显示部分使用了<% if() <%> 动态控制输出Html脚本(有对应的后端 ...
- 怎样解决canvas 插件 和html 页面中的事件冲突问题 ?
很简单 ,在html 执行事件所在的div中 设置 position:relative;
- Python文本编辑器推荐
首推当然是Sublime Text:可以中文化,百度上面有教程,页面比较酷炫,功能也不错 然后就是Notepad++,台湾开发,有中文界面
- 【转载】大白话Docker入门(一)
原文:https://yq.aliyun.com/articles/63035 随着docker现在越来越热门,自己也对docker的好奇心也越来越重,终于忍不住利用了一些时间把docker学习一遍. ...
- mina statemachine解读(二)
这里主要讲下对外接口暴露的处理. // 创建对外接口对象 TaskWork taskWork = new StateMachineProxyBuilder().setStateContextLooku ...
- First Unique Character in a String
Given a string, find the first non-repeating character in it and return it's index. If it doesn't ex ...
- HTTP协议详解(二)
接着第一篇学习.... 5 头域(首部) 每个头域由一个域名,冒号(:)和域值三部分组成.域名是大小写无关的,域值前可以添加任何数量的空格符,头域可以被扩展为多行,在每行开始处,使用至少一个空格或制表 ...
- 关于because the weaver option '-Xset:weaveJavaxPackages=true' has not been specified报错的解决方案
我是采用代理模式的aspectj <plugin> <groupId>org.apache.maven.plugins</groupId> <artifact ...
- linux服务器内存、根目录使用率、某进程的监控告警脚本
脚本内容如下 #!/bin/bash #磁盘超过百分之80发送邮件告警 DISK_USED=`df -T |sed -n "2p" |awk '{print ($4/$3)*100 ...
- MTV 和 MVC
MTV:(Django中用) M:models T:templates V:views MVC M:models V:views C:control(urls+views)