1、先全局安装babel-cli,输入命令 npm install babel-cli -g
2、输入 cd d:\es6 ; ---进入文件夹路径
3、输入 npm init; 一路回车键 ---(引导你创建一个package.json文件,包括名称、版本、作者这些信息等)
4、输入 npm install --save-dev babel-cli; ---(安装命令行转码babel-cli工具)
5、es6文件里新建配置文件.babelrc
复制代码
{ "presets": [], "plugins": [] }
粘贴到.babelrc 里
6、命令行窗口输入npm install --save-dev babel-preset-es2015;---(安装es2015依赖项)
将"es2015"加入.babelrc
{ "presets": ["es2015", "react", "stage-0"], "plugins": [] }
7、输入babel -h 检测是否安装成功
8、将es6编译成es5 例如:babel es6.js -o es5.js
9、压缩代码

sudo npm install uglify-js -g : 压缩代码

uglifyjs es5.js -o es5-min.js

组件封装:es6转es5的更多相关文章

  1. es6转es5

    一.在没有IDE情况下的转换 在"我的电脑->D盘”新建个文件夹es6,文件夹里新建一个文件es6.js. 打开命令行窗口 1.先全局安装babel-cli,输入命令 npm inst ...

  2. webpack es6 to es5支持配置

    1. 安装webpack npm install webpack --save-dev 2. 安装babel  实现 ES6 到 ES5 npm install --save-dev babel-co ...

  3. ES6转ES5:Gulp+Babel

    目标: ES6代码转成ES5 对转换后的ES5进行压缩 以上步骤自动监控执行 步骤: 1.安装插件 在命令行中定位到项目根目录 安装全局 Gulp npm install -g gulp 安装项目中使 ...

  4. Vuejs 页面的区域化与组件封装

    组件的好处 当我用vue写页面的时候,大量的数据页面渲染,引入组件简化主页面的代码量,当代码区域块代码差不多相同时,组件封装会更加简化代码.组件是Vue.js最强大的功能之一. 组件可以扩展HTML元 ...

  5. Babel 转码器 § es6转换es5

    Babel 转码器 § es6转换es5 实时转码 /  Repl  -babel-node / babel-register(自动转码引入babel-register模块) 配置文件.babelrc ...

  6. ReactNative之从HelloWorld中看环境搭建、组件封装、Props及State

    开篇呢,先给大家问个好,今天是中秋节,祝大家中秋节快乐!!虽然是中秋节,但是木有回家还是总结一下知识点写写博客吧,想着昨天总结一下的,但是昨天和几个同学小聚了一下,酒逢知己总是千杯少呢,喝的微醺不适合 ...

  7. es6转es5 在线转换工具

    es6转es5 在线转换工具 Babeljs es6console

  8. vue2.0在android5.0白屏, es6转es5保证浏览器兼容性

    1. 安装 npm install --save-dev babel-preset-es2015 2. 安装 npm install --save-dev babel-preset-stage-3 3 ...

  9. es6转es5在线工具

    es6转es5在线工具:https://babeljs.io/repl/# 程序员常用在线工具:https://tool.lu/

  10. Vue + Element UI 实现权限管理系统 (功能组件封装)

    组件封装 为了避免组件代码的臃肿,这里对主要的功能部件进行封装,保证代码的模块化和简洁度. 组件结构 组件封装重构后,试图组件结构如下图所示 代码一览 Home组件被简化,包含导航.头部和主内容三个组 ...

随机推荐

  1. Linux 第05天

    Linux 第05天 1.连接到Internet 1.1 配置网络信息 dmesg命令————查看网卡信息 dmesg | grep -i net ifconfig命令————查看IP.网关等相关信息 ...

  2. JAVA Day10

      使用继承 编写继承: class Engineer{ //公共的属性和方法 }   编写子类,继承父类, class SoftEnineer extends Enginerr{ //子类持有的属性 ...

  3. BZOJ 3105 [CQOI2013]新Nim游戏 ——线性基

    [题目分析] 神奇的题目,两人都可以第一次取走足够多堆的石子. nim游戏的规则是,如果异或和为0,那么就先手必输,否则先手有必胜策略. 所以只需要剩下一群异或和为0就可以了. 先排序,线性基扫一遍即 ...

  4. 未能加载文件或程序集“System.Data.SQLite”或它的一个依赖。试图加载格式不正确的程序

    Go to the IIS7 Application Pool -> advanced settings and set the 32-bit application to true.

  5. 创业方向:O2O及移动社交 from 沈博阳

    十个最大的互联网公司,六个在美国,四个在中国 中国创业的特殊 市场巨大self-contained,做足中国市场就很够 ... ... 监管   领导力,人的要求 之前成功带领过团队 有海外的工作经历 ...

  6. Codeforces Round #FF(255) DIV2

    A - DZY Loves Hash 水题,开辟一个数组即可 #include <iostream> #include <vector> #include <algori ...

  7. Easyui的Dialog的toolbar的自定义添加

    最近一直在写快速定制Web表格,基于Easyui,整个过程使用了大量的Easyui的dialog,每个dialog的代码大部分都雷同,感觉代码出现了很大程度的重复,然后想写一个通用的dialog设置函 ...

  8. Qt Visual Studio Add-in 导出的 .pri 怎么用?

    今天咱们介绍一下 Qt Add-in 导出的 pri 文件怎么用.   一般需要导出这个文件, 主要应该是跨平台编译的需求, 所以这个文件里包含的东西会比较少, 咱们看下导出的文件是什么样子的: # ...

  9. ZeroMQ接口函数之 :zmq_init - 初始化ZMQ环境上下文

    ZeroMQ 官方地址 :http://api.zeromq.org/4-0:zmq_init zmq_init(3) ØMQ Manual - ØMQ/3.2.5 Name zmq_init - 初 ...

  10. Unity字节序问题

    问题 Unity中有些配置信息并不想在发布之后给其他人看到,所以在打包的时候进行了简单的编码处理,然后保存为.bytes类型,读取的时候再进行解码处理.今天遇到的很奇葩的问题是: 如果bytes文件U ...