一个可扩展的、基于 gulp 的流式构建工具，支持多入口模式。
- lila-bin: lila 命令行工具
- lila-core: lila 核心包
- lila-tasks: lila 内置的 tasks
- lila-webpack: 封装的 webpack 插件
- lila-webpack-config: 内置的 webpack 配置生成器 for lila-webpack
- create-lila-app: 快速创建 lila 应用的工具
推荐使用 create-lila-app 创建 lila 应用，或者选择已有模板：
- react-app-starter: 一个创建 React 应用的模板，使用 Webpack 与 Storybook 开发构建.
- react-ts-app-starter: 一个创建 React 应用的模板，使用 TypeScript、Webpack 与 Storybook 开发构建.
- vue-app-starter: 一个创建 Vue 应用的模板，使用 Webpack 与 Storybook 开发构建.
然而，你也可以自定义搭建方式：
npm install lila-bin -g # 全局
npm install lila-bin --save-dev # 本地
如果全局安装，可以直接在命令行运行：
lila <cmd> [options]
如果本地安装，可以使用 npm-scripts 运行命令：
# package.json
"scripts": {
"run": "lila <cmd> [options]"
}
npm install lila-core lila-tasks --save-dev
配置初始化文件 lila.init.js.
// lila-core 不能直接导入
import tasksPlugin from 'lila-tasks';
import otherPlugin from 'lila-other-plugin';
// 这里需要导出一个函数
// 这里的 lia 对象就是 lila-core 包，你可以使用 lila-core 的所有 api
export default lila => {
// 做一些初始化操作
tasksPlugin(lila);
otherPlugin(lila);
// 这里需要返回一个配置生成器
return ({ entry, argv, cmd }) => {
// 根据 `entry, argv, cmd` 生成配置
const config = { ... }
// 返回配置对象
return config;
};
}
- src/
- dev/
- build/
src: 放置源代码的地方, 如html, css, less, scss, js, ts, vue, ...dev: 临时目录, 由本地开发时生成build: 生成构建文件的地方
如果需要使用自定义名字，可以这样修改：
lila.setSettings({
src: yourSrcDir,
dev: yourDevDir,
build: yourBuildDir,
})
export default lila => {
// 这里的 lia 对象就是 lila-core 包，这里就可以使用 lila 对象做任何事情
};
在 lila.init.js 文件中:
import plugin from 'your-lila-plugin';
export default lila => {
plugin(lila);
...
};
- 在 Windows 中, 运行
lila命令时必须与node_modules目录在同一级.