0.3.2 • Published 7 years ago
steamer-plugin-alloystore v0.3.2
steamer-plugin-alloystore
将组件上传或更新至alloystore(一个组件展示平台)
安装
// tnpm是内部npm管理命令行工具
tnpm i -g steamerjs
tnpm i -g steamer-plugin-alloystore推荐脚手架
组件开发推荐使用以下脚手架:
组件的 example 需要符合以下规范，才能正确被读取，并上传到 alloystore
example源码写在example/src下js代码仅且仅写在一个js文件中，此文件位置默认在example/src/page/index/container/index.jscss或其它样式代码，仅写在一个文件中，此文件位置默认在example/src/page/index/container/下，与js文件同级，支持css|less|stylus|scss|sass5种后缀，名字为index.[ext]，但在index.js中要引用，并以完整名称引用，如require('./index.css')或import './index.css如果你想自定
example路径，可以在package.json中设置，如下:
"alloystore": {
"demo": "example/src/index/container/"
}example 的配置也可以是 Object，此时写文件的完整路径。此时也可以带上 html。
"alloystore": {
"demo": {
"js": "example/src/index/container/index.js",
"style": "example/src/index/container/index.less",
"html": "example/src/index/main.html"
}
}html文件默认路径是在 example/src/page/index/main.html。
html文件里的 <script> 标签，请不要写在 <body>标签里，因为命令行只会解析被上传 <body> 标签里的内容。如
// 原html
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="index">
<script src="index"></script>
</head>
<body>
<div id="root"></div>
</body>
</html>
// 上传内容
<div id="root"></div>- 开发demo的时候，你可能会将
src里的入口文件进行引用，此时建议在webpack的alias中为组件设置别名，直接指向src中的入口文件，这样一来，你可以方便地这样引用：
import Index from 'react-list-scroll';- 开发demo的时候，请将最终
export的class，名字改成Main，这样才能被Alloystore识别。
使用
进入组件目录
cd component初次使用，进行登录，输入用户名和密码，正确后，会自动进行上传
steamer alloystore如果已经上传过，命令会在 package.json 写入以下字段，记录组件的 id:
"alloystore": {
"id": 35
}那么再次使用命令时，会帮你自动更新组件在线上的版本，以及 example。
如果你只是想上传 example，而不更新组件的版本，可使用以下命令：
steamer alloystore -u example
// or
steamer alloystore --update example开发
// 将你的插件传至全局路径，那你就可以直接使用 `steamer example`
npm link
// 当你完成开发，可以 `unlink` 你的插件
npm unlink