美文网首页
Babel介绍使用

Babel介绍使用

作者: blank的小粉er | 来源:发表于2017-07-26 11:45 被阅读0次

   安装Node.js
   Node.js的项目 npm 的包项目
   新建文件夹test
   在改文件夹下面输入npm init 初始化项目
   先全局安装
   npm install -g babel-cli
   安装成功  输入babel -V 查看版本号
   1.1 后缀名称为.babelrc文件
       添加:
       {
        "presets": ["env"]
       }
   1.2 安装babel的包文件
       npm install --save-dev babel-cli babel-preset-env
       --save-dev 保存到package.json文件中
       babel-cli    包工具
       babel-preset-env 包工具
       npm install --save-dev babel-cli babel-preset-env

   1.2 运行测试文件01example.js
   1.3 babel测试文件
       babel 01example.js
   1.4 babel -d 测试输出文件
       babel 01example.js --out-file 01result.js
       或者
       babel 01example.js -o 01result.js
   1.4.1 babel-node 01.js 运行输出结果
   1.5 babel 的配置环境介绍
   https://excaliburhan.com/post/babel-preset-and-plugins.html
   
   本地的服务器开发方式:
   browser-sync start --server

   要安装webpack 实现浏览器支持ES6的语法
   1. 安装webpack 
      npm install -g webpack;
   2. 新建后缀名称为.babelrc文件
       添加:
       {
        "presets": ["env"]
       }
   3. npm install --save-dev babel-loader babel-core 
   3. npm install --save-dev babel-preset-env

   4. 新建webpack.config.js文件
      

相关文章

  • Babel介绍使用

  • webpack中babel的使用(四)

    24 babel 1. babel介绍 2. babel命令行使用 在目录文件下创建demo.js 然后使用命令行...

  • Babel介绍

    babel对外宣传是“The Compiler for next generation javascript”,即...

  • babel介绍

    什么是babel babel的官网上是这么说的:babel是JS的compiler。 但是我觉得babel更像是一...

  • JavaScript 的Decorator 装饰器介绍

    Angular大量使用了JS的装饰器特性,先看 ruanyifeng的介绍 使用babel转换步骤 : npm i...

  • babel

    babel官网 babel 介绍 Babel 是一个通用的多用途 JavaScript 编译器。通过 Babel ...

  • Babel 用户手册

    babel官网 babel 介绍 Babel 是一个通用的多用途 JavaScript 编译器。通过 Babel ...

  • babel-preset-env使用介绍

    简介 本文介绍一个babel转码神器babel-preset-env 现如今不同的浏览器和平台chrome, op...

  • babel 转码器

    Babel介绍 Babel 是一个广泛使用的 ES6 转码器,可以将 ES6 代码转为 ES5 代码,从而在现有环...

  • js兼容性--babel的使用

    babel安装 babel可以和构建工具联合使用, 也可以独立使用, 如果需要独立使用babel, 需要安装两个库...

网友评论

      本文标题: Babel介绍使用

      本文链接:https://www.haomeiwen.com/subject/swbnkxtx.html