ES6知识点总结——学习网站及环境搭建

1、ES6学习网站

ES6官网:https://262.ecma-international.org/6.0/
阮一峰ES6学习电子书:https://es6.ruanyifeng.com/#docs/let
W3Cschool ES6中文教程:https://www.w3cschool.cn/escript6/escript6-s4pc37et.html
菜鸟教程:https://www.runoob.com/w3cnote/es6-tutorial.html

2、ES6环境搭建

  • 安装node.js环境,node官网:https://nodejs.org/zh-cn/
  • 新建文件夹(mkdir 文件名),并进入此项目文件夹(cd 文件名)
  • 初始化项目:npm init -y
  • 安装npm install --save-dev babel-preset-env babel-cli(新版node --save-dev可简写为-D)
  • 创建文件并配置:.babelrc
//.babelrc文件中的内容
{
    "presets": ["env"]
}

-y 的含义:yes的意思,在init的时候省去了敲回车的步骤,生成的默认的package.json

  • name项目名
  • version 版本号,一般从0.1.0开始
  • description描述
  • keywords 关键词用逗号隔开
  • author名字加邮箱

文件转化

  • 文件转化:babel src/index.js -o dist/index.js
  • 文件夹转化:babel src -d dist
  • 实时监控:babel src -w -d dist

如果提示下面错误:无法将“babel”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。

babel报错解决方案:

//在package.json文件中增加build代码
"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build":"babel src/index.js -o dist/index.js"
},
//执行npm run build

一般正常项目中babel会依托于webpack

你可能感兴趣的:(ES6学习目录,es6,学习,前端)