babel环境安装与编译
babel:将浏览器不支持的ES6语法转为javascript
查看node是否安装:
npm -v
node -v
实例演示:
在桌面新建part5目录
在cmd命令行中
cd desktop
cd part5
安装babel:
初始化package.json文件:描述当前项目信息,包括依赖等
npm init
安装babel cli
npm install --save-dev babel-cli
在package.json的"script"下添加一句:
"build": "babel entry.js"
创建entry.js文件,写es6代码用于测试
执行
npm run build
全局安装babel-cli
npm i babel-cli -g
安装babel-preset-env
npm i -D babel-preset-env
创建配置文件,告诉babel用什么规则来编译文件.babelrc
{
"presets": [
[
"env",
{
"targets":{
"browsers":["last 1 version"]
}
}
]
]
}
修改packsge.json
-o 输出到文件
-w 始终处于监听状态
"build": "babel entry.js -o index.js -w"
通过babel插件体验新特性
安装插件
npm i -D babel-plugin-transform-class-properties
修改.babelrc文件
{
"presets": [
[
"env",
{
"targets":{
"browsers":["last 1 version"]
}
}
]
],
"plugins":["transform-class-properties"]
}
babel环境安装与编译的更多相关文章
- 安装maven编译环境
安装maven编译环境 1.默认已经装好yum并配置好yum源(推荐使用163yum源) 2.安装JDK 3.安装相关依赖环境(root用户登陆) yum install -y cmake lzo-d ...
- CentOS离线安装GCC编译环境
gcc编译环境rpm下载 安装相关的rpm包,具体版本可能随时间变化而变化,可以去以下地址下载: 重庆大学镜像:http://b.mirrors.lanunion.org/CentOS/中国科学技术大 ...
- centos6.5环境源码编译安装mysql5.6.34
centos6.5环境源码编译安装mysql5.6.34 源码下载地址http://dev.mysql.com/downloads/mysql/5.6.html#downloads 选择Generic ...
- WebStorm 8.0安装LESS编译环境的教程
WebStorm是一个非常棒的Web前端开发编辑器,被程序猿们成为“最智能的JavaScript IDE”.对HTML5.Bootstrap框架.Node.js等都有完美支持.目前最新版本为WebSt ...
- 【转】Android 4.3源码的下载和编译环境的安装及编译
原文网址:http://jingyan.baidu.com/article/c85b7a641200e0003bac95a3.html 告诉windows用户一个不好的消息,windows环境下没法 ...
- Linux Object-C 编译环境安装
sudo apt-get install gnustep sudo apt-get install gnustep-devel sudo apt-get install gobjc . /usr/sh ...
- Linux本地yum源配置以及使用yum源安装gcc编译环境
本文档是图文安装本地yum源的教程,以安装gcc编译环境为例. 适用范围:所有的cetos,红帽,fedroa版本 适用人群:有一点linux基础的小白 范例系统版本:CentOS Linux rel ...
- Tesseract环境搭建及编译安装
Tesseract环境搭建及编译安装 Tesseract源码都是C++源码:对于不咋会C++的人来说,这真是...虽然说语言有相通性,但是...哎!!!!! 分享出来,也希望对大家有所帮助. 环境:w ...
- android编译环境安装
Android 编译环境安装 安装 Java 6 安装 Java 6 安装依赖包 (Ubuntu 12.04) $ sudo apt-get install git gnupg flex bison ...
随机推荐
- Android Studio 学习笔记(二):布局简介和xmlns说明
初学Android Studio,是在b站看的教程视频,这里的笔记也是以其为基础的,个人强烈安利: [天哥]Android开发视频教程最新版 Android Studio开发 Android 布局简介 ...
- 20200220--python学习第13天
今日内容 作业题(21题) 推导式 装饰器 模块[可选] 内容回顾 1.函数 a.参数 def func(a1,a2):pass def func(a1,a2=None):pass 默认参数推荐使用不 ...
- Nexus 安装运维手册
1. Nexus 安装与配置 1.1 下载Nexus 登录https://www.sonatype.com/download-oss-sonatype,下载最新的Nexus版本. 我这里使用的是nex ...
- vi/vim编辑器操作梳理
1. vi/vim编辑器详细使用讲解 1.1 vi/vim编辑器的3种模式 1.2 vi/vim编辑器操作说明 参数/命令/模式 说明 ###普通模式 :set nu 显示行号 :set non ...
- [CSS]三大特性之一继承性、层叠性、优先级
<style> div { color: red; font-size: 30px; {#background: #0066ff;#} } </style> <!-- 1 ...
- .NET代码混淆工具NET Reactor - 初学者系列-学习者系列文章
这几天无事,除了看书,然后就倒腾原来的代码.想起.NET的代码混淆工具软件,所以今天就讲讲这个.NET代码混淆工具. .NET代码混淆工具软件,以前有了解和找过,但是当时需求不大,所以找了下就搁置了. ...
- Mysql 保存emoji表情报错
保存emoji表情错误 首先错误表现,抛出业务层报错之外,根源的数据库错误是: sql 错误码 1366 字符集相关错误. uncategorized SQLException; SQL state ...
- 使用jquery封装的动画脚本(无动画、css3动画、js动画)
自己封装好的showhide.js 包含无动画.css3动画.js动画 包括:fade(淡入淡出) slideUpDown(上下滑动) slideLeftRight(左右滑动) fadeSlid ...
- MySQL存储过程和游标
一.存储过程 什么是存储过程,为什么要使用存储过程以及如何使用存储过程,并且介绍创建和使用存储过程的基本语法. 什么是存储过程: 存储过程可以说是一个记录集,它是由一些T-SQL语句组成的代码块,这些 ...
- DolphinScheduler1.2.1源码分析
DolphinScheduler在2020年2月24日发布了新版本1.2.1,从版本号就可以看出,这是一个小版本.主要涉及BUG修复.功能增强.新特性三个方面,我们会根据其发布内容,做简要的源码分析. ...