美文网首页
配置babel-cli

配置babel-cli

作者: 烟火粲然 | 来源:发表于2018-11-11 19:24 被阅读0次

局部配置

1.新建一个文件夹package(名字可以随便起)

2、打开cmd命令窗口

3、cd:package的路径

npm init

        <!-- 当前配置文件名 -->

        package name: (package) wyq

        package name: (package) wyq

        <!-- 版本号 -->

        version: (1.0.0) 1.1.1

        <!-- 描述 -->

        description: 这是一个学习简单配置babel的过程

        <!-- 入口 -->

    entry point: (index.js) //入口

    !-- 脚本测试 -->

    test command: (脚本测试)

    git repository: https://github.com/YQ-W //github仓库

    keywords: babel

    author: 刚刚

    license: (ISC) MIT(一般都写MIT)

4、需要用jquery,可以安装jquery
npm install --save-dev jquery

5、在cmd窗口输入:
安装babel-cli:
cnpm install --save-dev babel-cli

cnpm install babel-preset-env --save-dev
百度搜索babel进入官网


1541934887620.png

切换版本


1541934899383.png
找到配置命令
1)
1541934907979.png

2)


1541934917395.png

在package文件夹下:
6、在package文件夹下:

1)、 新建一个build文件夹里面存放转译后的js文件

2)、新建一个js文件存放es6语法的js文件

3)、在package.json里输入build: babel js -d build


package.json

4)、
新建文件.babelrc,在里面粘贴 { "presets": ["env"] }
7、cmd进入package文件夹下输入:

npm run build

注:package.json文件:(以后参考版本用)

{
  "name": "s",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "babel js -d build"
  },
  "keywords": [
    "d"
  ],
  "author": "",
  "license": "MIT",
  "devDependencies": {
    "babel-cli": "^6.26.0",
    "babel-preset-env": "^1.7.0"
  },
  "dependencies": {
    "jquery": "^3.3.1"
  }
}

相关文章

  • 2018-07-05 ES6学习

    一、环境配置 全局安装:babel-cli 本地安装:babel-cli、babel-preset-es2015 ...

  • 配置babel-cli

    局部配置 1.新建一个文件夹package(名字可以随便起) 2、打开cmd命令窗口 3、cd:package的路...

  • ES6学习笔记

    babel转码 在项目安装babel-cli npm install --global babel-cli ba...

  • 用ES7的语法写Node.js后端代码

    开始准备 首先安装babel-cli $ npm install --save-dev babel-cli 然后添...

  • babel

    babel-cli: 命令行转码: ng install -g babel-cli 基本用法: babel exa...

  • babel

    REPL在线编译器 .babelrc配置文件 babel-cli命令行工具 babel-node提供一个支持ES6...

  • babel安装配置

    1、先全局安装babel-cli(非必需),输入命令npm install babel-cli -g; 2、输入n...

  • 使用Babel把ES6编译成ES5

    先使用npm init创建一个项目 安装Babel 先全局安装Babel-cli Babel-cli命令行转码工具...

  • ES6 转换到 ES5的工具 - Babel的使用

    npm install -g babel-cli npm install babel-preset-es2015 ...

  • 最全的web前端命令!

    bable 安装: (1):npm install –g babel-cli (2):npm install -g...

网友评论

      本文标题:配置babel-cli

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