From b353b5fd35ab90111a9cedb893f498a1f62d8e9a Mon Sep 17 00:00:00 2001 From: BoBoooooo <17746714@qq.com> Date: Tue, 13 Apr 2021 20:01:45 +0800 Subject: [PATCH] ci: change webpack config --- build/config.js | 33 +++++++++++++++ build/webpack.component.js | 85 ++++++++++++++++++++++++++++++++++++++ components.json | 8 ++++ package.json | 16 +++++-- 4 files changed, 139 insertions(+), 3 deletions(-) create mode 100755 build/config.js create mode 100755 build/webpack.component.js create mode 100755 components.json diff --git a/build/config.js b/build/config.js new file mode 100755 index 0000000..44a5193 --- /dev/null +++ b/build/config.js @@ -0,0 +1,33 @@ +const path = require('path'); +const fs = require('fs'); +const nodeExternals = require('webpack-node-externals'); +const Components = require('../components.json'); + +let externals = {}; + +Object.keys(Components).forEach((key) => { + externals[`element-pro-crud/src/component/${key}`] = `element-pro-crud/lib/${key}`; +}); + +externals = [ + Object.assign( + { + vue: 'vue', + }, + externals, + ), + nodeExternals(), +]; + +exports.externals = externals; + +exports.alias = { + '@': path.resolve(__dirname, '../src'), +}; + +exports.vue = { + root: 'Vue', + commonjs: 'vue', + commonjs2: 'vue', + amd: 'vue', +}; diff --git a/build/webpack.component.js b/build/webpack.component.js new file mode 100755 index 0000000..dcdb223 --- /dev/null +++ b/build/webpack.component.js @@ -0,0 +1,85 @@ +const path = require('path'); +const ProgressBarPlugin = require('progress-bar-webpack-plugin'); +const VueLoaderPlugin = require('vue-loader/lib/plugin'); +const MiniCssExtractPlugin = require('mini-css-extract-plugin'); +const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer'); +const webpack = require('webpack'); +const Components = require('../components.json'); +const config = require('./config'); +const { name, version, author, homepage } = require('../package'); + +const webpackConfig = { + mode: 'production', + entry: Components, + output: { + path: path.resolve(process.cwd(), 'lib'), + publicPath: '/dist/', + filename: '[name].umd.min.js', + chunkFilename: '[id].js', + libraryTarget: 'umd', + }, + resolve: { + extensions: ['.ts', '.js', '.vue', '.json'], + alias: config.alias, + modules: ['node_modules'], + }, + // 排除部分依赖不进行打包 + externals: config.externals, + // 允许打包250kb以上的资源 + performance: { + hints: false, + }, + stats: 'none', + optimization: { + minimize: true, + }, + module: { + rules: [ + { + test: /\.vue$/, + loader: 'vue-loader', + options: { + compilerOptions: { + preserveWhitespace: false, + }, + }, + }, + { test: /\.ts?$/, loader: 'ts-loader', exclude: /node_modules/ }, + { + test: /\.(js?|babel|es6)$/, + include: process.cwd(), + exclude: /node_modules/, + loader: 'babel-loader', + }, + { + test: /\.(scss|css)$/, + loaders: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader'], + }, + { + test: /\.(svg|otf|ttf|woff2?|eot|gif|png|jpe?g)(\?\S*)?$/, + loader: 'url-loader', + query: { + limit: 10000, + name: path.posix.join('static', '[name].[hash:7].[ext]'), + }, + }, + ], + }, + plugins: [ + new VueLoaderPlugin(), + new MiniCssExtractPlugin({ + filename: '[name].css', + }), + new ProgressBarPlugin(), + new BundleAnalyzerPlugin({ + analyzerMode: 'static', + }), + new webpack.BannerPlugin({ + entryOnly: true, // 是否仅在入口包中输出 banner 信息 + // eslint-disable-next-line no-useless-concat + banner: () => `${name} v${version}` + '\n' + `Author: ${author}` + '\n' + `Documentation: ${homepage}` + '\n' + `Date: ${new Date()}`, + }), + ], +}; + +module.exports = webpackConfig; diff --git a/components.json b/components.json new file mode 100755 index 0000000..ba89698 --- /dev/null +++ b/components.json @@ -0,0 +1,8 @@ +{ + "pro-crud":"/src/index.ts", + "pro-form": "./src/component/pro-form/index.ts", + "pro-table": "./src/component/pro-table/index.ts", + "crud-table": "./src/component/crud-table/index.ts", + "form-designer": "./src/component/form-designer/index.ts", + "table-designer": "./src/component/table-designer/index.ts" +} diff --git a/package.json b/package.json index cbe6496..fb974dd 100644 --- a/package.json +++ b/package.json @@ -34,6 +34,7 @@ "lint": "vue-cli-service lint", "report": "cross-env IS_REPORT=true vue-cli-service build --target lib --name ProCrud --dest lib src/index.ts", "lib": "vue-cli-service build --target lib --name ProCrud --dest lib src/index.ts", + "webpack": "webpack --config build/webpack.component.js", "deploy": "npm run lib && npm publish", "log": "conventional-changelog --config ./node_modules/vue-cli-plugin-commitlint/lib/log -i CHANGELOG.md -s -r 0", "cz": "npm run log && git add . && git cz" @@ -50,43 +51,52 @@ "@vue/eslint-config-typescript": "^5.0.2", "axios": "^0.19.2", "babel-eslint": "^10.0.2", + "babel-plugin-component": "^1.1.1", "chai": "^4.2.0", "clipboard": "^2.0.1", "conventional-changelog-cli": "^2.1.0", "core-js": "2.6.5", "cross-env": "^7.0.2", + "css-loader": "^5.2.1", "dayjs": "1.8.20", "element-ui": "^2.13.2", "eslint": "^6.0.1", - "eslint-plugin-import": "^2.18.0", "eslint-config-prettier": "^8.1.0", - "eslint-plugin-vue": "^5.2.3", + "eslint-plugin-import": "^2.18.0", "eslint-plugin-prettier": "^3.3.1", + "eslint-plugin-vue": "^5.2.3", "html-webpack-include-assets-plugin": "^2.0.0", "husky": "^3.0.9", "inquirer": "^6.5.2", "lint-staged": "^9.2.0", "longest": "^2.0.1", + "mini-css-extract-plugin": "^1.4.1", "node-sass": "^4.12.0", "path": "^0.12.7", "prettier": "^2.2.1", + "progress-bar-webpack-plugin": "^2.1.0", "right-pad": "^1.0.1", "sass-loader": "^7.1.0", + "style-loader": "^2.0.0", "svg-sprite-loader": "^4.1.6", "svgo-loader": "2.2.1", "terser-webpack-plugin": "^1.2.4", + "ts-loader": "^8.1.0", "typescript": "~3.8.3", "vue": "2.6.11", "vue-awesome": "^3.5.4", "vue-class-component": "^7.2.3", "vue-cli-plugin-axios": "0.0.4", "vue-cli-plugin-commitlint": "^1.0.12", + "vue-loader": "^15.9.6", "vue-property-decorator": "^8.5.0", "vue-router": "3.4.3", "vue-template-compiler": "2.6.11", "vuedraggable": "^2.23.2", "webpack": "^4.35.3", - "webpack-bundle-analyzer": "^3.3.2" + "webpack-bundle-analyzer": "^3.3.2", + "webpack-cli": "^4.6.0", + "webpack-node-externals": "^2.5.2" }, "husky": { "hooks": {