在我的桌面有一个 ninghao-react 目录 .. 它里面的东西基本上就是我们在介绍 jspm 这个工具的时候准备的 ..

因为我要在视频里用一些新的技术，所以需要使用像 jspm 这样的工具 .. 它包含的 systemjs 可以加载 javascript 模块 .. 里面的 babel ，所以可以去编译 javascript .. 而且也会把 jsx 格式的代码编译成 javasciprt ..

这些都不需要我们担心 .. 直接用最行了 .. 下面去安装一下 react .. 可以使用 jspm install .. 安装的是 react .. 因为我要使用的并不是最新的移定版 .. 所以要去指定一下你想要使用的具体的版本 ..

完成以后再去安装一下 react-dom .. jspm install react-dom .. 同样手工指定一下要使用的版本 ..

在这个项目里面，我想再用一下 semantic-ui 里的样式 .. 注意它并不是 react 项目必须的东西 .. jspm install semantic-ui ..

我想直接在项目里导入 semantic-ui 的样式 .. 这需要添加一个 jspm 插件 ... 使用 jspm install 安装一下 .. 名字是 css ..

再用 browser-sync 为项目去创建一个服务器 .. 监视一些文件的变化 .. 再用编辑器打开当前的这个目录 ...

打开 index.html .. 这里我用了一个 System.import 导入了 app 目录下的 main.js .. 再打开这个文件 ..

在这个文件里面，我们去把 semantic-ui 里的样式表导入进来 .. 用一个 import .. 导入的东西是 semantic-ui 下面的 semantic-ui.min.css .. 注意这个 css 后面要加上一个叹号 ..

这个样式表真正的位置是在 jspm_packages .. github .. Semantic-Org .. Semantic-UI@2.1.3 这个目录的下面 .. 你会看到 semantic.min.css ...

下面再去确定一下我们已经可以使用这个样式了 .. 回到 index.html .. 这里添加一个 div .. 上面用一个 ui .. 还有 container .. 这些类的样式来自 semantic ui .. 在它里面添加一个按钮 ..

button.ui.green.button .. 在这个包装上面再添加点内边距 ..

保存 .. 回到浏览器 .. 在这里会显示一个绿色的按钮 .. 打开开发者工具 .. Elements .. 在 head 标签里面 .. 你会看到导入进来的 css 文件 ..

jspm install react@0.14.0-rc1
jspm install react-dom@0.14.0-rc1
jspm install semantic-ui
jspm install css