娜娜奇脚手架
以React方式高效开发小程序
这只是anu的一个扩展,通过实现不同的render,以支持在微信小程序,百度小程序,支付宝小程,快应用,H5, hybird上运行。
安装
npm
npm install nanachi-cli -g
yarn
yarn global add nanachi-cli
使用方式
- nanachi init
<project-name>
创建工程
cd <project-name> && npm i
安装依赖
nanachi watch:[wx|bu|ali|quick]
监听构建小程序
nanachi build:[wx|bu|ali|quick]
构建小程序
- 用微信开发工具打开当中的dist目录,自己在source目录中进行开发
注意:快应用下构建结束后,需要执行以下三步骤
- npm install
- npm run build
- npm run server
详情请见快应用文档
详见 https://rubylouvre.github.io/nanachi/index.html 或 https://github.com/RubyLouvre/anu/tree/master/packages/render/miniapp
nanachi api
const nanachi = require('nanachi-cli');
nanachi({
watch,
platform,
beta,
betaUi,
compress,
compressOption,
huawei,
prevLoaders,
postloaders,
rules,
plugins,
complete
});
自定义loader
用户可以使用nanachi api编译nanachi应用,同时支持自定义预处理loader和后处理loader。
compress压缩模式就是使用后处理loader实现的,链接:https://www.npmjs.com/package/nanachi-compress-loader
我们规定了loader的输入和输出格式
{
queues:
[{
code,
type,
path
}],
exportCode
}
nanachi config
自定义loader应用到项目中,有两种方式供选择:
- 在项目根目录下创建nanachi配置文件,nanachi.config.js
module.exports = {
postLoaders: ['nanachi-compress-loader']
}
正常运行nanachi命令,即可将自定义配置应用到项目中
npm install nanachi-compress-loader --save-dev
nanachi build
- 使用nanachi api,自定义编译脚本
const nanachi = require('nanachi-cli');
nanachi({
platform: 'ali',
postLoaders: ['nanachi-compress-loader']
});
node build.js
开发者交流群