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. hdu 3632 A Captivating Match(区间dp)

    题目链接:http://acm.split.hdu.edu.cn/showproblem.php?pid=3632 题意:n个人进行比赛,每个人有一个价值a[i],最后冠军只有一个,只能相邻两个人进行 ...

  2. Codeforces Round #363 (Div. 2)

    A题 http://codeforces.com/problemset/problem/699/A 非常的水,两个相向而行,且间距最小的点,搜一遍就是答案了. #include <cstdio& ...

  3. devexpress 安装及破解

    安装dx DXperience-10.1.4 破解文件下载

  4. jQuery插件(多级菜单)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. BlockingQueue深入分析(转)

    1.BlockingQueue定义的常用方法如下   抛出异常 特殊值 阻塞 超时 插入 add(e) offer(e) put(e) offer(e,time,unit) 移除 remove() p ...

  6. Leetcode Construct Binary Tree from Inorder and Postorder Traversal

    Given inorder and postorder traversal of a tree, construct the binary tree. Note:You may assume that ...

  7. HDU 1392 凸包模板题,求凸包周长

    1.HDU 1392 Surround the Trees 2.题意:就是求凸包周长 3.总结:第一次做计算几何,没办法,还是看了大牛的博客 #include<iostream> #inc ...

  8. java分享第七天-02(读取文件)

    一 读取文件 public static void main(String[] args) throws FileNotFoundException, IOException { // 建立File对 ...

  9. Openfire3.9.3源代码导入eclipse中开发配置指南

    这篇文章向大家介绍一下,如何把openfire3.9.3源码导入eclipse中,编译并启动的详细过程. 首先得感谢这篇文章的作者,http://www.micmiu.com/opensource/o ...

  10. Codeforces Round #371 (Div. 2) C

    传送门  map或者字典数的应用 简单题 题意: 思路: AC代码: #include<iostream> #include<cstring> #include<cmat ...