@rollup-use/vue2-js v0.0.7
@rollup-use/vue2-js
A Vue2
+js npm library bundle tool use rollup. Clone vue2-js-starter to quick start.
此工具使用 rollup, 可以打包纯 js 的 Vue2
npm 库项目. 中文文档. 可以复制 vue2-js-starter 以快速开始.
Examples/用例列表
You can add your public repo here. 欢迎添加你的项目到这里.
Usage
Follow steps is tested in a project generated by Vue CLI.
Install dependencies
npm install @rollup-use/core @rollup-use/vue2-js typescript --save-dev
npm install @babel/runtime vue-runtime-helpers -save
Add vue to peerDependencies
of package.json
.
"peerDependencies": {
"vue": "^2.*.*"
}
Create a entry file to export Vue components for rollup, such as src/lib-entry.js
and with content like follow:
export { default } from "./LibraryComponent.vue";
export { default as CustomName } from "./LibraryComponent2.vue";
export { default as CustomName3 } from "./LibraryComponent3.vue";
Can export multiple components. Can custom exported name.
Copy directory scripts
into your project. Add 2 npm scripts to scripts
of package.json
like follow:
"scripts": {
"build-lib": "rollup -c scripts/build.js & node scripts/build.js --report",
"watch-lib": "rollup -c scripts/build.js --watch"
}
Check scripts/build.ts
and change it for your requirement. In most case, you may only need to change input
. Once scripts/build.ts
changed, execute npm run compile-build-lib
to generate scripts/build.js
. Then execute npm run build-lib
to generate the final results.
Exclude core-js
Don't include core-js in your package.json, including dependencies
and devDependencies
. Or there will be core-js
imports in your bundled results.
中文文档
使用
以下步骤在 Vue CLI 生成的项目中测试通过.
安装依赖
npm install @rollup-use/core @rollup-use/vue2-js typescript --save-dev
npm install @babel/runtime vue-runtime-helpers -save
添加 vue 到 package.json
的 peerDependencies
.
"peerDependencies": {
"vue": "^2.*.*"
}
创建打包的入口文件, 此文件导出 Vue 组件, 例 src/lib-entry.js
, 示例内容如下:
export { default } from "./LibraryComponent.vue";
export { default as CustomName } from "./LibraryComponent2.vue";
export { default as CustomName3 } from "./LibraryComponent3.vue";
可以导出多个组件, 导出时可以自定义导出名.
复制目录 scripts
到你的项目. 参照如下, 添加 3 条 npm script 到package.json
的scripts
:
"scripts": {
"build-lib": "rollup -c scripts/build.js & node scripts/build.js --report",
"watch-lib": "rollup -c scripts/build.js --watch"
}
按你的需求修改scripts/build.ts
. 多数情况下你可能只需要修改input
变量. 一旦scripts/build.ts
有改动, 执行 npm run compile-build-lib
以生成 scripts/build.js
. 再执行 npm run build-lib
即可生成最终结果.
排除 core-js
不要在 package.json
中包含 core-js
, 包括 dependencies
和 devDependencies
. 否则打包结果中会有 core-js
导入.