es6的基础知识

一、 npm应用
node的包管理机制
npm init
npm install xxx
npm uninstall xxx
npm config list
npm run xxx
二、 js的模块化
js之间相互调用,相互配合

js与js
jquery.js
a.js
b.js
c.js
common.js
index.js
--->
bundle.js

mode

(0) requireJS
(1)commonJS
	.1 模块定义
		任何的js文件module对象
		目录作为模块,npm init初始化当前目录,index.js
		
		module.exports
		module.exports = {
			name:'',
			sayName:function(){}
		}

		module.exports.name = '';
		module.exports.sayName= function(){}





	
   
  .2导入模块
		require()
	.3 打包
		webpack

(2) ES6
	.1. 定义模块
		
		export default {

		}
	
.2导入模块

		import xxx from xxx;

三、 ES6->ES5转换
.1) 手动转换
$ babel a.js -o a-es5.js
…1. npm install babel --global
…2. npm install babel-preset-latest
…3. .babelrc
…4. $ babel a.js -o a-es5.js

.2) 自动转换(集成到webpack)
	npm run build
	..1. npm install babel-core babel-loader --save-dev
	..2. npm install babel-preset-latest
	..3. .babelrc
	..4. webpack.config.js
	..5. $npm run build

四、模块化编程解决前端需求过程

app01
	index.html
	css
		style.css
	js
		index.js
	images
	font
app02
	index.html
	css
	images
	font
	js
		???
		【bundle.js】
		app02-js
			package.json
			index.js
			src
				category.js
				article.js
				user.js
				http.js

app03
	package.json
	index.js
	App.vue (html js css)
	src
		category.vue(html js css)
		article.vue(html js css)
		user.vue(html js css)
		http.js

	npm run build
		dist
			index.html
			css
			js
			images
			font
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值