README
如何使用
环境准备(可选)
建议使用npm
的2.x
版本,这个版本虽然安装时间略长,但目录没有被打平,如果想了解snorkel-cli
内部实现,2.x
的安装结果会比较清爽。
写这个文档时,2.x
的最新版为2.14.12
。
sudo tnpm i npm@2.14.12 -g -d
snorkel-cli
(必选)(更新时在群里提示)
全局安装snorkel-cli
是创建脚手架的终端命令工具,用于生成新的项目,新的页面。前期会经常更新,但对已生成的页面不产生影响。
sudo tnpm i snorkel-cli@latest -g -d
snorkel-scripts
(必选)(必要时才更新)
全局安装snorkel-scripts
是项目开发阶段的依赖,包括webpack
,babel
,*-loader
等很多工具。
sudo tnpm i snorkel-scripts@latest -g -d
初始化项目
后续加入更多的模板后,在终端开启交互式创建,目前还不支持。
创建名为foo
的项目
sc foo
启动开发环境
进入项目根目录
cd foo
npm install
npm start
上面命令执行后,在浏览器打开localhost:3000/hello.html
即可调试hello
页面。
可用的命令
sc page {{page-name}}
创建页面:页面名称命名规范:如果是多个单词,请使用连字符。
例:创建名为foo-bar
的页面,在项目new
目录执行:
sc page foo-bar
创建新页面后,重新执行npm start
,访问localhost:3000/foo-bar.html
查看效果。
npm run build:daily
日常打包:打包后的文件在项目根目录的build
目录下。
npm run build
生产打包:打包后的文件位置同上。
工具库
已集成的工具库文档如下:
- react + react-dom
- redux
- redux-thunk
- react-redux
- natty-fetch 独立的ajax模块
- stylus css编译器
- lodash js utility library
- antd 组件库
TODO
- 单页面模板
- 移动端模板
- 版本锁定,将项目使用的
cli
的版本固定 - 添加局部构建,提升构建速度,项目开发前期,允许只构建自己的页面。
snorkel-cli
共建全局安装snorkel-scrips
snorkel-scripts
是项目开发阶段的依赖,包括webpack,babel,*-loader
等很多工具。
sudo tnpm i snorkel-scripts@2.0.0-alpha.5 -g -d
拷贝snorkel-cli
的git
库到本地
git clone git@gitlab.alibaba-inc.com:crm/snorkel-cli.git
进入项目根目录执行
npm install
npm link
这时候,再次运行sc project-name
创建新项目的时候,脚手架调用的就是刚刚拷贝到本地的snorkel-cli
库里的代码了。改动即生效。