laoriy cli service
npm install @laoriy/cli-servicev1.0.0+
v1.1.0+
js
// 注意，这里只是介绍说明，实际已在模板中自动添加了打包工具，无需手动添加
// install
npm i @laoriy/cli-service -D
// 启动本地开发服务
laoriy-cli-service dev
// 打包生成非压缩文件
laoriy-cli-service build:dev
// 打包生成压缩文件
laoriy-cli-service build:prod
// copy src目录源文件
laoriy-cli-service build:src
// 发布打包，实际是各个打包命令的集合
laoriy-cli-service build
`
$3
> 基本的webpack配置项（链接），内部会进行merge；如下列举是已测试可正常使用的。
- externals
> 扩展配置项
- css.extract
Type: boolean
Default: true
是否将组件中的 CSS 提取至一个独立的 CSS 文件中 (而不是动态注入到 JavaScript 中的 inline 代码)。false时，会将css中的静态资源转换为base64格式，增加包的体积，所以对于vue组件中css样式中引用本地静态文件很少（字体，图片等）的情况下。可以设置为false，便于使用。
$3
- 1、目前打包处理只对es6+的语法（如var，const）做了babel编译，如果库里面有用到新的api（如Array.prototype.includes）
，需在工程化项目中配置语法转换处理，如vue项目vue.config.js中配置：
`js
transpileDependencies: ['laoriy-lib'],
`
- 2、插件间相互引用，按需引入插件后重复代码的处理问题
- 3、只做了打包js库的测试，vue组件库的待完善更新
$3
> 使用npm link方式
`
// 调试
cd 当前项目根目录(如，cd /AIOT_laoriy-npm-libs/laoriy-cli/cli-service)
npm link
cd 当前插件项目根目录(如，cd /Users/projects/test-lib)
laoriy-cli-service dev
// ...
laoriy-cli-service build
// 调试完毕
npm unlink
`
$3
- 输入
1. 构建入口为根目录index.ts，不建议更改
2. 本地开发调试入口examples/index.ts，模板为examples/index.html，不建议更改
- 输出
1. 打包后的js文件名根据scr/package.json的main字段配置，其中lib设置为xx.js，vue组件设置为dist/xx.js（默认是设置好的,只需要改个自己的名字）。
2. lib输出在根目录结构如下：
`js
| -- dist
| -- src src目录源代码
| -- types ts声明
| -- utils 按需引入打包处理的各个分包
| -- a.js
| -- b.js
| -- package.json lib库对应包的package.json说明文件
| -- xx.js 打包产物
| -- xx.min.js 打包产物
`
3. vue组件输出在根目录结构如下：
`js
| -- dist
| -- dist
| -- styles
| -- index.css 打包后的css产物
| -- xx.js 打包产物
| -- xx.min.js 打包产物
| -- src src目录源代码
| -- types ts声明
| -- package.json lib库对应包的package.json说明文件
``