🎶 Sym - 一款用 Java 实现的现代化社区(论坛/BBS/社交网络/博客)平台

📕 思源笔记 - 一款桌面端笔记应用,支持 Windows、Mac 和 Linux

🎸 Solo - B3log 分布式社区的博客端节点,欢迎加入下一代社区网络

♏ Vditor - 一款浏览器端的 Markdown 编辑器

JSPM 初体验

终于得空,体验一把 JSPM

jspm is a package manager for the SystemJS universal module loader, built on top of the dynamic ES6 module loader

 

1. 安装

npm install jspm -g

2. 创建项目

npm install jspm --save-dev
jspm init

3. 安装包

jspm install npm:lodash-node
jspm install github:components/jquery
jspm install jquery
jspm install myname=npm:underscore

4. 编码

./lib/bootstrap.js

import $ from 'jquery';
export function bootstrap() {
    // bootstrap code here
    console.log('bootstrap function');
    console.log($('body').length);
};

./lib/bootstrap2.js

export function bootstrap2() {
    // bootstrap code here
    console.log('bootstrap2 function');
}

export function bootstrap3() {
// bootstrap code here
console.log('bootstrap3 function');
}

./lib/main.js

import {bootstrap} from './bootstrap.js';
import {bootstrap2} from './bootstrap2.js';
import {bootstrap3} from './bootstrap2.js';
bootstrap();
bootstrap2();
bootstrap3()

./text.html

<!doctype html>
<script src="jspm_packages/system.js"></script>
<script src="config.js"></script>
<script>
    System.import('./lib/main.js');
</script>

5. 运行

随便丢到一个 web 服务器即可。记得修改 ./config.js 中的 baseURL

6. Bundle for projection

我也不知道干嘛用的,运行下就重新编译了。还不知道怎么像 grunt 一样的 watch

jspm bundle lib/main --inject

萌萌哒,才喜欢 grunt 半年多,希望他能长久。


欢迎注册黑客派社区,开启你的博客之旅。让学习和分享成为一种习惯!

留下你的脚步