美文网首页打包编译
Babel: JavaScript编译工具

Babel: JavaScript编译工具

作者: StevenHu_Sir | 来源:发表于2019-06-05 12:44 被阅读0次

1.Babel 安装与删除

#1.卸载
npm uninstall babel-cli --global
#2.安装
cd 到package.json文件目录
执行
npm install babel-cli --save-dev

2.使用 use-babel-cli

创建一个script.js文件

console.log("hello, ninhao.net");

执行

./node_modules/.bin/babel script.js
#输出结果:console.log("hello, ninhao.net");

将结果保存到文件中

./node_modules/.bin/babel script.js --out-file script-compile.js 

编译src整个文件的js文件到lib目录

./node_modules/.bin/babel src --out-dir lib 

监听文件变化 --watch

./node_modules/.bin/babel src --watch --out-dir lib 

停止
control+c 快捷键

3.npm script

babel src --watch --out-dir lib
script.jpg

终端执行 npm run build

4.plugin-and-preset

插件和预设

babel-preset-react
babel-preset

5.preset-es2015

安装
--save-dev 保存到开发依赖中

npm install babel-preset-es2015 --save-dev

创建.babelrc 文件 babel的预设文件

{
   "presets": ["es2015"]
}

//'use strict'

6.preset-react

安装
--save-dev 保存到开发依赖中

npm install babel-preset-react --save-dev

创建.babelrc 文件 babel的预设文件

{
   "presets": ["react"]
}

jsx 转化为 java-script

相关文章

  • Babel

    1、Babel简介 Babel 是一个 JavaScript 的编译工具,它可以把一种形式的 JavaScript...

  • babel插件入门

    关于babel Babel 是一个 JavaScript 编译器 Babel 是一个工具链,主要用于将 ECMAS...

  • babelrc配置

    Babel 是什么? Babel 是一个 JavaScript 编译器 Babel 是一个工具链,主要用于将采用 ...

  • Babel: JavaScript编译工具

    1.Babel 安装与删除 2.使用 use-babel-cli 创建一个script.js文件 执行 将结果保存...

  • babel 使用

    Babel 是什么? Babel 是一个 JavaScript 编译器 Babel 是一个工具链,主要用于将 EC...

  • 前端开发必备之——Babel

    今天给大家介绍一款前端开发必备工具Babel Babel是什么? JavaScript编译器 Babel 是一个工...

  • Babel

    Babel 是什么? Babel 是一个 JavaScript 编译器 Babel 是一个工具链,主要用于将 EC...

  • Babel 是什么?

    Babel 是一个 JavaScript 编译器 Babel 是一个工具链,主要用于将采用 ECMAScript ...

  • 初次相识Babel v7,多多指教

    Babel 是一个 JavaScript 编译器。 Babel 是一个工具链,主要用于将 ECMAScript 2...

  • bable词法Es6转换

    一:bable 1、Babel 是一个 JavaScript 编译器;2、Babel 是一个工具链,主要用于将 E...

网友评论

    本文标题:Babel: JavaScript编译工具

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