脚本宝典收集整理的这篇文章主要介绍了babel的使用(一),脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
Babel 入门
http://www.ruanyifeng.com/blo...
Babel packages
https://github.com/babel/babe...
谈谈Babel v6的新特性及未来定位
http://www.open-open.com/lib/...
Babel 在线转换
Babel 使用指南
http://guoyongfeng.github.io/...
1. Babel core 浏览器环境
安装: npm install --save-dev babel-core@5
2. 命令行转码babel-cli
安装: npm install --save-dev babel-cli
改写package.json
{
// ...
"devDePEndencies": {
"babel-cli": "^6.0.0"
},
"scripts": {
"build": "babel src -d lib"
},
}
转码的时候,就执行下面的命令。
npm run build
实例
package.json
{
"name": "es6-sec",
"version": "1.0.0",
"description": "",
"reposITory": "",
"license": "",
"readme": "",
"scripts": {
"build": "babel src -d asset"
},
"devDependencies": {
"babel-cli": "^6.18.0",
"babel-PReset-es2015": "^6.18.0"
}
}
.babelrc
{
"presets": ["es2015"],
"plugins": []
}
js
// 变量,常量
function test() {
let a = 10;
const b = 20;
console.LOG(a);
console.log(b);
}
test();
// 数组的解构赋值
function example() {
return [1, 2, 3];
}
VAR [a, b, c] = example();
console.log('a:' + a);
console.log('b:' + b);
console.log('c:' + c);
// 对象的解构赋值
function examples() {
return {
foo: 1,
baz: 2
};
}
var {foo, baz} = examples();
console.log('foo:' + foo);
console.log(baz);
var input = [1, 2, 3];
input.map(item => item + 1);
htML
<!DOCTYPE html>
<html lang="ch-CN">
<head>
<meta charset="UTF-8">
<title>es6-sec</title>
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
</head>
<body>
<script type="text/javascript" src="asset/index.js"></script>
</script>
</body>
</html>
以上是脚本宝典为你收集整理的babel的使用(一)全部内容,希望文章能够帮你解决babel的使用(一)所遇到的问题。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。