babel安装

注意:如果没有装node.js,先去装一个!!安装node.js时会默认安装npm。

步骤:

1、新建一个文件夹,装接下来的所有东西。我新建了一个learn-es6文件夹

2、在learn-es6项目文件下创建根目录文件:

-package.json
-src文件夹--index.html--js文件夹---index.js
这一步的关键是
  1. 一定要有src文件夹!!要不然后面会报错
  2. 预定要新建一个package.json文件!

这两个千万不能少,少一个就会报错!

index.html文件内容先为空、index.js内容也先为空(安装完成后,测试用)。

3、配置文件.babelrc

打开MAC的终端:

3.1 先sudo -s获取最高权限;
3.2 然后通过cd进入learn-es6项目文件;
3.3 接着“vim .babelrc”新建一个.babelrc 文件:

键盘输入”i“进入编辑模式,然后输入

  {"presets": ["es2015","react","stage-2"],"plugins": []}

输入完毕,“esc”键退出。输入“:wq”,冒号是英文的,表示保存并退出。

并且安装以下规则集:

# 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

4、命令行转码babel-cli

注意:babel-cli 安装在项目之中,官网已经强烈建议不要安装在全局环境下!!

终端依旧在learn-es6的位置,执行以下命令:

$ npm install --save-dev babel-cli

5、执行下列命令,没有报错即可。

$ npm run build


更多专业前端知识,请上 【猿2048】www.mk2048.com

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/364255.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

针对新手的Java EE7和Maven项目–第1部分–简单的Maven项目结构–父pom

为什么呢 很多时候,我在日常工作中试图解决一些基本或复杂的Maven / Java EE项目结构问题。 为了提供解决方案,我经常最终会尝试项目结构,测试我在不同应用程序服务器上的部署并细化我的配置。 Maven对于新来者来说可能会有陡峭的学习曲线&a…

sql server 学习记录

sql-server 基础: 1、查看sqlserver的数据表 SELECT name,crdate FROM SysObjects Where XTypeU order by crdate desc 查看数据表的字段 SELECT A.name AS table_name,B.name AS column_name,C.value AS column_description FROM sys.tables A INNER JOIN sys.col…

简单对象访问协议

简单对象访问协议 2000年7月11日 SOAP 是“简单对象访问协议”(Simple Object Access Protocol)的简称,这种方式能够使用现有的 Internet 体系结构,创建运行在 Internet 上的、分布广泛的复杂计算环境。SOAP 所涉及的应用程序以非…

mysql 子字符串函数_MySQL 内置字符串函数

MySQL内置函数concat()用于连接字段LTRIM(),RTRIM(),TRIM()分别用于去除左边空格,右边空格,以及左右空格都去除NOW()放回当前的日期和时间UPPER() 和LOWER()upper():转换为年夜写输出; lower() 转换为小写输出LEFT()返回串左边的字符RIGHT()返回串右边的字符,办法参考LEFT()LOC…

服务器建网站www无法访问,IIS6服务器搭建网站无法访问解决方案总结_DOIT.com.cn...

很多朋友在用IIS6架网站的时候遇到不少问题,而这些问题有些在过去的IIS5里面就遇到过,有些是新出来的,俺忙活了一下午,做了很多次试验,结合以前的排错经验,做出了这个总结,希望能给大家帮上忙。…

弱监督学习下商品识别:CVPR 2018细粒度识别挑战赛获胜方案简介

弱监督学习下商品识别:CVPR 2018细粒度识别挑战赛获胜方案简介 细粒度视觉分类(FGCV,Fine-Grained Visual Categorization)即识别细分类别的任务,一般它需要同时使用全局图像信息与局部特征信息精确识别图像子类别。细…

JS中apply和call的应用和区别

因为object没有某个方法,但是别的对象有,可以借助apply或call像别的对象借方法来操作。 猫吃鱼,狗吃肉,奥特曼打小怪兽。 有天狗想吃鱼了 猫.吃鱼.call(狗,鱼) 狗就吃到鱼了 猫成精了,想打怪兽 奥特曼.打小…

解题:NOIP 2018 保卫王国

题面 最小支配集全集-最大独立集 所以先把点权改成正无穷/负无穷来保证强制选/不选某个点到独立集里&#xff0c;然后变成了洛谷的动态DP模板 GTMDNOIP2018ZTY 1 #include<stack>2 #include<cstdio>3 #include<cstring>4 #include<algorithm>5 using n…

petshop4学习_重构DataList实现分页

掌握要点: <IList>,DataGrid翻页事件...详细代码如下,慢慢体会..usingSystem;usingSystem.Collections;usingSystem.Collections.Specialized;usingSystem.Text;usingSystem.Text.RegularExpressions;usingSystem.Web.UI;usingSystem.Web.UI.WebControls;namespaceCustom…

如何与Java 8,NetBeans Platform 8,Jenkins,Jacoco和Sonar进行持续集成

介绍 Java 8出现了&#xff0c;人们所期待的革命终于发布了&#xff0c;我敢肯定&#xff0c;你们中的许多人都在想着同样的问题“我应该在项目中使用它吗&#xff1f;”。 好吧&#xff0c;几个月来我遇到了同样的问题&#xff0c;今天我有一个答案想与大家分享。 很多方面都…

mysql max datetime_MYSQL在联接语句中选择MAX日期

我正在尝试返回记录编号的历史位置我所拥有的是&#xff1a;SELECT l.location, t.transaction_id, t.date_modifiedFROM transactions as tINNER JOIN (SELECTt1.received_id, t1.transaction_id, t1.date_modifiedFROM (SELECT received_id, MAX(date_modified) as maxmodify…

pxe远程装机

1&#xff1a;主机 yum install dhcp vim /etc/dhcp/dhcpd.conf allow booting;      allow bootp;      ddns-update-style interim;      ignore client-updates;      subnet 192.168.10.0 netmask 255.255.255.0 {      option subnet-mask …

模板引擎

模板引擎是用来渲染页面的。页面中一部分内容是根据程序生成的&#xff0c;会变化的。 主流的模板引擎有两种&#xff1a; * jade 破坏式的、强依赖的 用了它就不能用html。 * ejs 非侵入式的、比较温和。 并不破坏原有的html 、 css(其实是往里面加入东西。) jade 根据…

Learning ROS: rqt_console和rqt_logger_level使用

rqt_console&#xff1a;操作、查看log信息 rqt_logger_level&#xff1a;设置log等级 打开node&#xff1a; rosrun rqt_console rqt_console rosrun rqt_logger_level rqt_logger_level rosrun turtlesim turtlesim_node rosrun turtlesim turtle_teleop_key 在rqt_logger_le…

WSS学习(一)---简单部署图

研究了一段时间的WSS&#xff0c;终于找到点头绪了今天把这段时间的思路整理了一下&#xff0c;结果发现就是这么一张图也不知道研究的对不对&#xff0c;有高手发现不对的给点指点有也在研究的大家一起讨论一下简单说明&#xff1a;数据库用SQL2005&#xff0c;报表用SQL2005的…

Wildfly 8.0通过其JAXRS 2.0实现提供了无缝的JSON支持。

很高兴看到Wildfly 8.0使得使用同一组JAXB类中的XML和JSON表示 两者变得更加容易&#xff0c;而无需任何额外的检查或配置不同的JAXB运行时实现。 您需要做的就是 只需从JAXRS资源类中的业务方法中返回JAXB对象 将HTTP Accept标头设置为application / json 返回JAXB类的简单…

mysql order by int_mysql order by是怎么工作的?

假设我们要查询一个市民表中城市杭州的所有人的名字&#xff0c;并且按照名字排序CREATE TABLE t (id int(11) NOT NULL,city varchar(16) NOT NULL,name varchar(16) NOT NULL,age int(11) NOT NULL,addr varchar(128) DEFAULT NULL,PRIMARY KEY (id),KEY city (city)) ENGINE…

URL模块之parse方法

url.parse(urlString , boolean , boolean) parse这个方法可以将一个url的字符串解析并返回一个url的对象。 参数&#xff1a; urlString指传入一个url地址的字符串第二个参数&#xff08;可省&#xff09;传入一个布尔值&#xff0c;默认为false&#xff0c;为true时&#x…

git使用学习笔记

## 关于Git Workspace&#xff1a;工作区 Index / Stage&#xff1a;暂存区 Repository&#xff1a;仓库区&#xff08;或本地仓库&#xff09; Remote&#xff1a;远程仓库##一、新建代码库# 在当前目录新建一个Git代码库$ git init # 新建一个目录&#xff0c;将其初始化为Gi…

over(partition by)开窗函数的使用

开窗函数是分析函数中的一种&#xff0c;开窗函数与聚合函数的区别是&#xff1a;开窗函数是用于计算基于组的某种聚合值且每个的组的聚合计算结果可以有多行&#xff0c;而聚合函数每个组的聚合计算结果只有一个。使用开窗函数可以在没有group by语句的情况下计算聚合值并将结…