jspm简介

jspm简介
功能
1. ⽀持加载JavaScript各种模块化的写法：AMD、CommonJS、标准化的ES6模块...
2. 包管理器：能从不同的源安装不同的包，默认的源有npm、github...，安装好包后，在代码中只需要⼀⾏代码，就可以使⽤这些包提供的功能
3. 开发时，可以使⽤Traceur或Babel，实时的在浏览器上编译JavaScript，把ES6代码编译成ES5代码
4.在正式发布应⽤时，可以优化创建的包，把模块依赖的东西打成⼀个包
安装jspm
npm install jspm -g 在全局范围安装jspm，就可以在任何地⽅使⽤jspm命令了
jspm // 完成后输⼊jspm，会返回⼀些帮组信息
cd ~/desktop
mkdir reactProject // 创建项⽬⽂件夹
cd reactProject
npm init // 创建package.json，⼀路回车即可
ls // 查看⽂件夹，就会⼀个package.json⽂件
npm install jspm --save-dev // 把 jspm添加到项⽬开发依赖
ls // node_modules package.json两个⽂件
jspm init // 为jspm创建配置⽂件config.js，⼀系列问题，可⼀路回车
ls // 会发现有config.js , jspm_packages（jspm安装的⼀些包） node_modules package.json
安装、卸载包
jspm install jquery=github:components/jquery
jspm uninstall jquery
ES6模块, BrowserSync 使⽤
1. npm install -g browser-sync // 安装Node后，通过npm安装BrowserSync(⾃动刷新)
2. 使⽤BrowserSync： browser-sync start --server 开启服务
打包bundle 功能
进⼊项⽬⽬录
jspm bundle app/main app/build.js // 将app⽂件夹下的main.js⾥⾯的js都打包到build.js中
完成以后，会在 app ⽬录下⾯创建⼀个叫 build.js 的⽂件
在html中⽤⼀个 script 标签把 app 下的 build.js 嵌⼊进来并保存
浏览器在 network 这个选项卡⾥，少了很多 js ⽂件，因为已经将他们打包了。