soraka
v0.0.1
Published
Soraka is a React packaging tool for dcloud.
Downloads
9
Readme
soraka
soraka
在英雄联盟里面一名强大的持续补血奶妈型辅助,和这个工具的定位一样,是一个强大的 React 开发流程打包工具。
Features
- 🎲 在无配置下开箱即用
- 🎮 支持 JSON 和 JS 模块配置文件
- 🥇 支持 ES6 以及 TypeScript,同时支持 postcss / less / sass / stylus
- ⛑ 覆盖前端项目初始化、本地调试、编译完整流程
- 👾 符合 CDC 团队内前端开发规范
Coming Soon Features
- 🚀 mock 数据
- 🎡 jest 测试支持
- 🚧 ESLint & TSLint 支持
Getting Started
## 全局安装 soraka
$ npm i soraka -g
## 查看当前版本号
$ soraka -v
## 初始化项目文件夹
$ soraka init
## 本地开发环境调试
$ soraka serve
## 编译最终文件
$ soraka build
Configuration
soraka 支持 JSON 和 JS 两种配置方式,用户可以根据需要选择适合自己项目的配置方式。使用 JSON 配置方式则在根目录下创建 .sorakarc
配置文件,使用 JS 配置方式则在根目录下创建 .sorakarc.js
配置文件。
.sorakarc
{
"entry": "./app.js",
"proxy": {
"/api": {
"target": "http://example.com/",
"changeOrigin": true,
"pathRewrite": { "^/api": "/projectA/api" }
}
},
"env": {
"development": {
"define": {
"__PUBLIC_PATH__": "/"
}
}
}
}
.sorakarc.js
module.exports = {
entry: "./app.js",
proxy: {
"/api": {
target: "http://example.com/",
changeOrigin: true,
pathRewrite: { "^/api": "/projectA/api" }
}
},
env: {
development: {
define: {
"__PUBLIC_PATH__": "/"
}
}
}
}
port
本地开发环境的端口,默认端口为 10086
。
autoOpenBrowser
顾名思义,这个选项控制在启动本地开发环境之后是否打开调试地址。
entry
指定 webpack 的入口文件,路径相对于 path/src
,支持多个入口文件。
"entry": "./app.js"
proxy
使用 http-proxy-middleware
配置本地开发环境的代理,可以代理线上的接口。
"proxy": {
"/api": {
"target": "http://example.com/",
"changeOrigin": true,
"pathRewrite": { "^/api": "/projectA/api" }
}
}
此时访问本地 /api
会将请求代理到 http://example.com/projectA/api
。
define
通过 webpack 的 DefinePlugin 传递给代码,值会自动做 JSON.stringify
处理。 比如:
"define": {
"__PUBLIC_PATH__": "/path"
}
alias
配置 webpack 的 resolve.alias 属性。
externals
配置 webpack 的 externals 属性。
html
配置 htmlWebpackPlugin
插件的参数,以下为默认参数配置:
{
"filename": "index.html",
"template": "path/src/index.html",
"inject": true
}
env
根据不同的环境使用不同的配置,soraka serve
会使用 config.env.development
的配置覆盖 config
的配置,soraka build
则会使用 config.env.production
。