`
lan13217
  • 浏览: 495816 次
  • 性别: Icon_minigender_1
社区版块
存档分类
最新评论

babel 使用记录

 
阅读更多
//
$ echo '{ "presets": ["es2015","react"] }' > .babelrc

# ES2015转码规则
$ npm install --save-dev babel-preset-es2015
# react转码规则
$ npm install --save-dev babel-preset-react
# ES7不同阶段语法提案的转码规则(共有4个阶段),选装一个
$ npm install --save-dev babel-preset-stage-0
$ npm install --save-dev babel-preset-stage-1
$ npm install --save-dev babel-preset-stage-2
$ npm install --save-dev babel-preset-stage-3

//
$ npm install --global babel-cli
--------------------------------------------------------------
//
$ babel-node
> [1,2,3].map(x => x * x)
    [ 1, 4, 9 ]
--------------------------------------------------------------
// point.js
export class Point {
    constructor(x, y) {
        this.x = x;
        this.y = y;
    }
}
if (require.main === module) {
    let pt = new Point(7,4);
    console.log(`My point: ${JSON.stringify(pt)}`);
}

$ babel-node point.js 
  My point: {"x":7,"y":4}
--------------------------------------------------------------




http://babeljs.io/docs/setup/#node

http://www.2ality.com/2015/03/babel-on-node.html

http://www.ruanyifeng.com/blog/2016/01/babel.html
分享到:
评论

相关推荐

    babelcodemod重写JavaScript使用babel插件

    “babelcodemod重写JavaScript使用babel插件”这一标题指的是使用Babel的codemod工具来转换或更新JavaScript代码。Babel是JavaScript社区广泛使用的转译器,它允许开发者使用最新或实验性的JavaScript特性,然后将其...

    OpenBabel.pdf

    - 如何使用OpenBabel进行分子结构搜索? - 如何通过命令行接口操作OpenBabel? ### 2. 安装OpenBabel #### 2.1 安装二进制包 用户可以通过下载预编译的二进制包来快速安装OpenBabel。这些包通常由社区或操作系统...

    JavaScript中ES6 Babel正确安装过程_.docx

    这里的`--save`参数会将`babel-preset-es2021`记录到你的`package.json`文件的依赖项中。如果在安装插件时省略这个参数,那么在执行转换时可能不会有任何效果,因为Babel 6.x及更高版本不再包含默认的转换插件。 ...

    react-playground:使用 babel 和 npm 作为构建工具进行React

    在本文中,我们将深入探讨如何使用Babel和npm构建React应用程序。React是一个流行的JavaScript库,用于构建用户界面,尤其适用于单页应用。Babel则是一个转换JavaScript代码的工具,它允许我们使用最新的JavaScript...

    JavaScript中ES6 Babel正确安装过程

    Babel是一个广泛使用的JavaScript转换器,能够将最新版的JavaScript代码转换为向后兼容的版本,确保在不同环境下运行无误。 Babel6.x的安装过程分为以下几个步骤: 1. 首先,你可以通过访问[Babel在线转换器]...

    hexo-renderer-babel:Hexo 的 Babel 渲染器插件

    "hexo-renderer-babel" 就是这样一个插件,专门用于处理使用 ES6 及以上版本 JavaScript 语法的文件。 标题中的 "hexo-renderer-babel" 指的是这个插件,它允许用户在 Hexo 站点中使用现代 JavaScript 特性,如箭头...

    react-parcel-babel:React Parcel Babel启动器

    在创建新项目时,开发者只需要使用这个启动器,就可以快速搭建一个具备React、Parcel和Babel基础配置的项目模板。这个模板通常包括了基本的项目结构,如src目录、index.js入口文件、.babelrc配置文件以及package....

    babel-plugin-class-name:Babel插件,在构建时添加包含类名称的静态属性

    在前端开发中,JavaScript是不可或缺的一部分,而Babel则是一个广泛使用的工具,它允许我们使用最新版本的JavaScript语法(ES6+)并将其转换为广泛的浏览器和环境兼容的JavaScript代码。`babel-plugin-class-name`是...

    React全栈 Redux Flux webpack Babel整合开发.pdf

    Babel是一款广泛使用的JavaScript编译器,主要用于将现代JavaScript语法转换为浏览器能够识别的版本。这对于使用最新ES6+特性的开发者来说至关重要,因为它可以帮助确保代码的兼容性和可维护性。 #### 关键特性: -...

    babel-plugin-transform-line:将标识符__line替换为源行号

    开发者可以使用Babel插件来扩展Babel的能力,例如添加新的语法转换、优化代码或实现特殊需求。`babel-plugin-transform-line`就是这样的一个插件,它提供了自定义转换的功能,将特定的魔法变量(`__line`)转换为...

    webpack-babel-react-development-tools, JavaScript 2015 开发/生产环境.zip

    由于2015年时,许多浏览器对ES6的支持并不完全,Babel的存在使得开发者可以提前使用新特性,而不必担心兼容性问题。Babel 还可以通过预设(Presets)来转换代码风格,比如“@babel/preset-env”会根据目标环境自动...

    babel-plugin-trace:这是一个Babel插件,它添加了简单明了的声明性语法,用于向JavaScript应用程序添加调试日志记录

    Babel插件:跟踪 这是插件和宏,它添加了简单明了的声明性语法,用于向JavaScript应用程序添加调试日志记录。 什么? 在编写棘手的代码时,通常会插入console.log()语句来帮助跟踪功能的内部状态。 在开发过程中这...

    babel-plugin-catch-reporter:一个自动报告程序错误的 babel 插件

    babel-plugin-catch-reporter 一个 babel 插件: 如果您忘记这样做,请将 catch 子句添加到您的 Promise 中。 向所有 catch 子句添加记录器,无论是 catch 块还是 promise .catch()函数调用。 需要时自动导入...

    flask-i18n-example:使用Flask-Babel和gettext转换Flask应用程序(包括javascript文件)的示例

    这是一个粗略且记录不良的测试应用程序,显示了如何使用Flask-Babel和gettext来翻译Flask应用程序。 它最有趣的部分是javascript内容的翻译,因为在Internet上找不到与此主题相关的连贯文档。 创建应用程序 照常...

    商业源码-编程源码-Project Babel CASH188 增进版.zip

    9. **错误处理与日志记录**:源码中可能包含异常处理机制和日志记录,这对于问题排查和性能优化至关重要。 10. **安全机制**:如果涉及用户数据,项目可能会有加密算法、身份验证和授权机制,如OAuth2.0、JWT。 ...

    babel-polyfill-silencer:Webpack使用的微库,可避免babel隐式导入core-js polyfills

    已淘汰babel-polyfill-silencer Webpack使用的微库,可避免babel隐式导入core-js ... 欢迎对此进行记录的PR :grinning_face_with_smiling_eyes: 最后,如果使用babel-transform-runtime将其传递给选项{polyfill: false}

    Node.js-基于Node.jsReactMongoDBSwagger和Babel的JavaScript全栈入门套件

    Swagger是一种用于设计、构建、记录和使用RESTful API的开源工具集。它通过规范化的OpenAPI Specification(OAS)帮助开发者定义API接口,生成文档、客户端SDK和服务器端代码,从而简化API的开发、测试和维护。...

    利用babel将es6语法转es5的简单示例

    由于浏览器对新特性的支持程度不同,Babel使得开发者能够使用最新的语言特性,而不用担心兼容性问题。本文将向你展示如何使用Babel将ES6代码转换为ES5代码,以便在各种环境中流畅运行。 **文件目录结构** 在开始...

    IOS应用源码之amatig-babel4iphone-732eed0.zip

    8. **数据持久化**:为了存储用户的偏好或翻译记录,应用可能使用Core Data、SQLite或NSUserDefault等机制进行数据持久化。 9. **用户界面**:UI可能使用Auto Layout和Size Classes进行布局,确保在不同屏幕尺寸的...

    使用简单的注释记录函数的所有作业和返回值

    "使用简单的注释记录函数的所有作业和返回值"这个主题强调了在编写JavaScript代码时,应如何有效地进行注释以提高代码质量。 在JavaScript中,我们通常使用两种主要类型的注释:单行注释(//)和多行注释(/* ... *...

Global site tag (gtag.js) - Google Analytics