创建基于ES6的项目(babel)

首先感谢业界的很多大神，创造了很多的模版项目，成功的把我用成了傻逼。今天有个小的功能，使用CRC进行checksum校验，选择使用node-crc包，本来想写个小demo测试一下，结果发现crc全部使用es6语法进行构建，长期使用别人模版的我瞬间傻逼了。所以才有了这篇文章。

babel handbook 中文版

初始化项目

1
2
cd crc-demo # crc-demo自己的项目目录
npm init

安装依赖

  • babel和目标运行环境依赖（es5）

    目标环境根据自己实际的环境定义，具体参考preset-env

    1
    2
    # rimraf 用来删除文件的
    npm install babel-cli babel-preset-es2015 rimraf --save-dev

  • 创建 .babelrc 配置文件

    在crc-demo下添加.babelrc文件，参考这里

    1
    2
    3
    4
    5
    {
        "presets": [
            "es2015" // 环境和安装依赖的环境相关(babel-preset-es2015)
        ]
    }

package.json的scripts中添加babel

src目录的js文件会编译到dist中，每次编译之前都会先删除dist文件。

1
2
3
4
5
6
{
    "scripts": {
        "build": "rimraf dist/ && babel src --out-dir dist/ --copy-files",
        "start": "npm run build && node dist/index.js"
      }
}

执行index.js内容

1
npm run start

参考

https://www.cnblogs.com/weschen/p/7154284.html

https://www.babeljs.cn/docs/plugins/preset-env/

https://www.babeljs.cn/docs/usage/cli/