feat(build): umd 构建,支持 <script> 直接引入使用

This commit is contained in:
sight 2022-03-28 17:59:26 +08:00
parent 264866a007
commit e9389d00fe
4 changed files with 47 additions and 1 deletions

1
.gitignore vendored
View File

@ -4,6 +4,7 @@ dist/
example/dist/ example/dist/
lib/ lib/
es/ es/
umd/
/types/ /types/
npm-debug.log* npm-debug.log*
yarn-debug.log* yarn-debug.log*

View File

@ -6,6 +6,8 @@
"description": "a component library for Vue 3 base on layui-vue", "description": "a component library for Vue 3 base on layui-vue",
"homepage": "http://www.layui-vue.com", "homepage": "http://www.layui-vue.com",
"main": "es/index.js", "main": "es/index.js",
"unpkg": "umd/index.js",
"jsdelivr": "umd/index.js",
"types": "types/index.d.ts", "types": "types/index.d.ts",
"style": "lib/index.css", "style": "lib/index.css",
"keywords": [ "keywords": [
@ -22,9 +24,10 @@
}, },
"scripts": { "scripts": {
"dev": "vite example", "dev": "vite example",
"build": "npm run build:all && npm run build:es && npm run build:types && npm run build:example", "build": "npm run build:all && npm run build:es && npm run build:umd && npm run build:types && npm run build:example",
"build:es": "vite build --emptyOutDir --config ./script/build.es.ts", "build:es": "vite build --emptyOutDir --config ./script/build.es.ts",
"build:all": "vite build --emptyOutDir --config ./script/build.all.ts", "build:all": "vite build --emptyOutDir --config ./script/build.all.ts",
"build:umd": "vite build --emptyOutDir --config ./script/build.umd.ts",
"build:types": "rimraf types && tsc -d", "build:types": "rimraf types && tsc -d",
"build:example": "vite build example", "build:example": "vite build example",
"lint:eslint": "eslint 'src/**/*.{vue,ts,tsx}' --fix", "lint:eslint": "eslint 'src/**/*.{vue,ts,tsx}' --fix",
@ -85,6 +88,7 @@
"files": [ "files": [
"lib", "lib",
"es", "es",
"umd",
"types" "types"
], ],
"browserslist": [ "browserslist": [

40
script/build.umd.ts Normal file
View File

@ -0,0 +1,40 @@
import { UserConfigExport } from 'vite'
import vue from '@vitejs/plugin-vue'
import { resolve } from 'path'
export default (): UserConfigExport => {
return {
publicDir: false,
resolve: {
alias: [
{
find: '@',
replacement: resolve(process.cwd(), './')
}
]
},
plugins: [
vue(),
],
build: {
cssCodeSplit: false,
outDir: 'umd',
emptyOutDir: true,
lib: {
entry: resolve(process.cwd(), './src/index.ts'),
name: 'LayuiVue',
formats: ['umd'],
fileName: (name) => `index.js`
},
rollupOptions: {
output: {
globals: {
vue: 'Vue'
},
assetFileNames: 'index.css',
},
external: ['vue', 'vue-router']
}
}
}
}

View File

@ -250,6 +250,7 @@ export {
LayNoticeBar, LayNoticeBar,
LayTransition, LayTransition,
LayUpload, LayUpload,
install,
}; };
export { layer }; export { layer };