GitBucket
4.6.0
Toggle navigation
Sign in
Files
Branches
1
Tags
Issues
Pull Requests
Labels
Milestones
Wiki
08335
/
hivui-platform-template
hivui平台项目模板
Browse code
//预览时,预编译这些包,以防vite 启动后,浏览器通过自动模块加载导致刷新页面
optimizeDeps:{ include: [] }
master
1 parent
3a68349
commit
bcf42b53cb3a64ed5e7cd7bbfb1623b15ffe7668
caibinghong
authored
on 22 Dec 2022
Showing
3 changed files
build/webpack.base.conf_threadLoader.js
package.json
vite.config.js
Show notes
View
build/webpack.base.conf_threadLoader.js
100644 → 0
const path = require('path'); var HtmlWebpackPlugin = require('html-webpack-plugin'); const AddAssetHtmlPlugin = require('add-asset-html-webpack-plugin');//------------ const CleanWebpackPlugin = require('clean-webpack-plugin'); const VueLoaderPlugin = require('vue-loader/lib/plugin'); const CopyWebpackPlugin = require('copy-webpack-plugin'); const ProgressBarPlugin = require('progress-bar-webpack-plugin'); const UglifyJsPlugin = require("uglifyjs-webpack-plugin"); const OptimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin"); const webpack = require('webpack'); const packageConfig = require('../package.json'); const utils = require('./utils') const vueLoaderConfig = require('./vue-loader.conf') let evnConfig = require('./getEnvVar') const os = require('os'); const cpus = os.cpus().length; console.log(cpus, ' Math.floor(cpus/2)||1', Math.floor(cpus / 2) || 1) let threadLoader = { loader: "thread-loader", // 有同样配置的 loader 会共享一个 worker 池(worker pool) options: { // 产生的 worker 的数量,默认是 cpu 的核心数 workers: Math.floor(cpus / 2) || 1, // 一个 worker 进程中并行执行工作的数量 // 默认为 20 workerParallelJobs: 50, // 额外的 node.js 参数 // workerNodeArgs: ['--max-old-space-size', '1024'], // 闲置时定时删除 worker 进程 // 默认为 500ms // 可以设置为无穷大, 这样在监视模式(--watch)下可以保持 worker 持续存在 poolTimeout: 2000, // 池(pool)分配给 worker 的工作数量 // 默认为 200 // 降低这个数值会降低总体的效率,但是会提升工作分布更均一 poolParallelJobs: 50, // 池(pool)的名称 // 可以修改名称来创建其余选项都一样的池(pool) // name: "my-pool" } }; let projectName = packageConfig.name == 'hi-vui-template' ? 'project' : packageConfig.name; module.exports = { // entry: { // 'login': ['babel-polyfill', './project/hivuiLogin/index.js'], // 'main': ['babel-polyfill','./project/hivuiMain/index.js'] // }, // output: { // filename: '[name].[contenthash].js', // chunkFilename: '[name].[contenthash].js', // path: path.resolve(__dirname, 'dist') // }, resolve: { extensions: ['.js', '.jsx', '.vue', '.json', '.dtvevt', '.dvue'], alias: { 'vue$': 'vue/dist/vue.esm.js', 'vuex$': 'vuex/dist/vuex.esm.js', '@': path.resolve(__dirname, `${projectName}`), '@main': path.resolve(__dirname, `../${projectName}/hivuiMain`), // '@': path.resolve(__dirname, 'src'), '@birt': path.resolve(__dirname, `../${projectName}/hivuiBirt`), 'pinyin': 'js-pinyin', } }, externals: { 'vue': 'Vue', 'vuex': 'Vuex', 'vue-router': 'VueRouter', "element-ui": "ELEMENT", }, module: { rules: [ ...(utils.styleLoaders({ sourceMap: false, extract: process.env.NODE_ENV === 'production', usePostCSS: true })), { test: /\.(js|jsx|dtvevt?|babel|es6)$/, // use: [ // // threadLoader, // 'thread-loader', // 'babel-loader' // ] use: ['babel-loader'] // loader: 'babel-loader', // exclude: [path.resolve(__dirname, 'node_modules')]//放开,里头有些也是 可选链操作符 }, { test: /\.(vue|dvue)$/, // use: [ // // threadLoader, // 'thread-loader', // { // loader: 'vue-loader', // options: vueLoaderConfig // } // ] use: [{ loader: 'vue-loader', options: vueLoaderConfig }] // loader: 'vue-loader', // options: vueLoaderConfig }, { test: /\.(png|jpe?g|gif|svg)(\?.*)?$/, loader: 'url-loader', options: { limit: 10000, name: '[name].[hash:7].[ext]', publicPath: "../img/", //替换CSS引用的图片路径 可以替换成爱拍云上的路径 outputPath: "static/img/" //生成之后存放的路径 } }, { test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/, loader: 'url-loader', options: { limit: 10000, name: '[name].[hash:7].[ext]', publicPath: "../img/", //替换CSS引用的图片路径 可以替换成爱拍云上的路径 outputPath: "static/media/" //生成之后存放的路径 } }, { test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/, loader: 'url-loader', options: { limit: 10000, name: '[name].[hash:7].[ext]', publicPath: "../fonts/", //替换CSS引用的图片路径 可以替换成爱拍云上的路径 outputPath: "static/fonts/" //生成之后存放的路径 } } ] }, optimization: { minimizer: [ new UglifyJsPlugin({ cache: true, parallel: true, sourceMap: true }), new OptimizeCSSAssetsPlugin({ cssProcessor: require('cssnano'), cssProcessorPluginOptions: { preset: ['default', { discardComments: { removeAll: true } }], }, canPrint: false }) ], runtimeChunk: { "name": "manifest" }, splitChunks: { cacheGroups: { default: false, vendors: false, common: { test: /[\\/]node_modules[\\/](babel-runtime|lodash|@babel|core-js)/, name: 'commons', priority: -90, minSize: 0, chunks: "all", reuseExistingChunk: true }, vendor: { test: /[\\/]node_modules[\\/]/, name: 'vendors', priority: -100, reuseExistingChunk: true, chunks: 'all' } } } }, plugins: [ new VueLoaderPlugin(), // new HappyPack({ // id: 'happy_js_jsx', // //共享进程池 // threadPool: happyThreadPool, // loaders: ['babel-loader'] // }), // new HappyPack({ // id: 'happy-vue-loader', // loaders: [{ // loader: 'vue-loader', // options:vueLoaderConfig // }], // threadPool: happyThreadPool // }), new webpack.HashedModuleIdsPlugin(), new ProgressBarPlugin(), // new CleanWebpackPlugin(['dist']), //注入全局变量的插件,通常使用该插件来判别代码运行的环境变量 new webpack.DefinePlugin({ 'process.env': evnConfig }), new webpack.DllReferencePlugin({ context: path.resolve(__dirname), manifest: require('../assets_platform/vendor_dll/vendor-manifest.json') }), //这个主要是将生成的vendor.dll.js文件加上hash值插入到页面中。[也可以手动写到html这里不做处理] // new AddAssetHtmlPlugin([{ // filepath: path.resolve(__dirname, 'js_dll/comm_vendors.dll.js'), // outputPath: 'js_dll/', // publicPath: 'js_dll/', // includeSourcemap: false, // hash: true, // }]), // new CopyWebpackPlugin([ // { // from: path.resolve(__dirname, 'assets_platform'), // to: path.resolve(__dirname, 'dist/assets_platform') // }, // // { // // from: path.resolve(__dirname, 'js_dll'), // // to: path.resolve(__dirname, 'dist') // // } // ]) ] };
Ignore Space
Show notes
View
package.json
{ "name": "hi-vui-template", "version": "1.1.21", "description": "A hi-vui-template project", "author": "zhcTeam", "scripts": { "rm:vite": "rimraf node_modules/.vite && rimraf node_modules/.cache", "pm2:start": "pm2 -s start processes.json", "dev": "vite --host", "def": "vite --host", "build": "node build/copyBaseAssets.js && cross-env NODE_ENV=production node build/webpack.prod.conf.js", "build:modules": "cross-env NODE_ENV=production node build/webpack.prod.conf.js", "build1": "webpack --mode production --config build/webpack.prod.conf.js", "dll": "webpack --config build/webpack.dll.conf.js", "start": "webpack-dev-server --config build/webpack.dev.conf.js", "copyassets": "node build/copyBaseAssets.js" }, "devDependencies": { "@babel/core": "^7.1.2", "@babel/plugin-proposal-nullish-coalescing-operator": "^7.16.7", "@babel/plugin-proposal-optional-chaining": "^7.16.7", "@babel/plugin-syntax-dynamic-import": "^7.0.0", "@babel/preset-env": "^7.1.0", "@vitejs/plugin-vue-jsx": "^1.3.3", "@vue/babel-helper-vue-jsx-merge-props": "^1.2.1", "@vue/babel-preset-jsx": "^1.2.4", "add-asset-html-webpack-plugin": "^3.2.0", "autoprefixer": "^9.1.5", "babel-loader": "^8.0.4", "babel-plugin-component": "^1.1.1", "babel-plugin-transform-vite-meta-env": "^1.0.3", "caniuse-lite": "^1.0.30001436", "chalk": "^3.0.0", "clean-webpack-plugin": "^0.1.19", "copy-webpack-plugin": "^4.5.3", "cross-env": "^7.0.3", "css-loader": "^1.0.0", "dotenv": "^10.0.0", "file-loader": "^2.0.0", "happypack": "^5.0.1", "html-webpack-plugin": "^4.5.2", "less": "^3.13.1", "less-loader": "^5.0.0", "mini-css-extract-plugin": "^1.6.2", "node-sass": "^4.9.3", "optimize-css-assets-webpack-plugin": "^5.0.1", "parallel-webpack": "^2.6.0", "postcss-import": "^11.1.0", "postcss-loader": "^2.1.6", "postcss-url": "^7.3.2", "progress-bar-webpack-plugin": "^2.1.0", "sass": "^1.49.0", "sass-loader": "^7.1.0", "style-loader": "^0.23.0", "terser-webpack-plugin": "^4.2.3", "thread-loader": "^3.0.4", "uglifyjs-webpack-plugin": "^2.0.1", "url-loader": "^1.1.1", "vite": "2.3.7", "vite-plugin-html": "^2.1.1", "vite-plugin-imp": "^2.0.11", "vite-plugin-pagedata": "^1.0.4", "vite-plugin-vue2": "^1.9.0", "vue-loader": "^15.4.2", "vue-template-compiler": "^2.6.14", "webpack": "^4.46.0", "webpack-cli": "^4.9.2", "webpack-dev-server": "^3.11.3", "webpack-merge": "^4.1.4" }, "dependencies": { "axios": "^0.24.0", "babel-polyfill": "^6.26.0", "canvas": "^2.9.0", "classnames": "^2.3.1", "deep-lu-trans": "^1.0.5", "echarts": "^5.2.2", "echarts-liquidfill": "^3.1.0", "element-ui": "^2.15.7", "enquire.js": "^2.1.6", "font-awesome": "^4.7.0", "hi-taskcenter": "^1.0.9", "hi-ui": "^1.1.1006", "html2canvas": "^1.4.1", "jquery": "^3.6.0", "js-cookie": "^3.0.1", "js-md5": "^0.7.3", "js-pinyin": "^0.1.9", "jspdf": "^2.5.1", "lodash": "^4.17.11", "qrcodejs2": "0.0.2", "screenfull": "^6.0.0", "sortablejs": "^1.14.0", "v-clipboard": "^2.2.3", "vue": "^2.6.14", "vue-draggable-resizable": "^2.3.0", "vue-gemini-scrollbar": "^2.0.1", "vue-i18n": "^8.27.0", "vue-jstree": "^2.1.6", "vue-qr": "^3.2.4", "vue-router": "^3.0.1", "vuex": "^3.6.2", "xlsx": "^0.18.5", "zhc-birt-cmps": "2.8.63", "zhc-birt-core": "^1.9.0", "zhc-flowchart": "^1.0.20" } }
{ "name": "hi-vui-template", "version": "1.1.20", "description": "A hi-vui-template project", "author": "zhcTeam", "scripts": { "rm:vite": "rimraf node_modules/.vite && rimraf node_modules/.cache", "pm2:start": "pm2 -s start processes.json", "dev": "vite --host", "def": "vite --host", "build": "node build/copyBaseAssets.js && cross-env NODE_ENV=production node build/webpack.prod.conf.js", "build:modules": "cross-env NODE_ENV=production node build/webpack.prod.conf.js", "build1": "webpack --mode production --config build/webpack.prod.conf.js", "dll": "webpack --config build/webpack.dll.conf.js", "start": "webpack-dev-server --config build/webpack.dev.conf.js", "copyassets": "node build/copyBaseAssets.js" }, "devDependencies": { "@babel/core": "^7.1.2", "@babel/plugin-proposal-nullish-coalescing-operator": "^7.16.7", "@babel/plugin-proposal-optional-chaining": "^7.16.7", "@babel/plugin-syntax-dynamic-import": "^7.0.0", "@babel/preset-env": "^7.1.0", "@vitejs/plugin-vue-jsx": "^1.3.3", "@vue/babel-helper-vue-jsx-merge-props": "^1.2.1", "@vue/babel-preset-jsx": "^1.2.4", "add-asset-html-webpack-plugin": "^3.2.0", "autoprefixer": "^9.1.5", "babel-loader": "^8.0.4", "babel-plugin-component": "^1.1.1", "babel-plugin-transform-vite-meta-env": "^1.0.3", "caniuse-lite": "^1.0.30001436", "chalk": "^3.0.0", "clean-webpack-plugin": "^0.1.19", "copy-webpack-plugin": "^4.5.3", "cross-env": "^7.0.3", "css-loader": "^1.0.0", "dotenv": "^10.0.0", "file-loader": "^2.0.0", "happypack": "^5.0.1", "html-webpack-plugin": "^4.5.2", "less": "^3.13.1", "less-loader": "^5.0.0", "mini-css-extract-plugin": "^1.6.2", "node-sass": "^4.9.3", "optimize-css-assets-webpack-plugin": "^5.0.1", "parallel-webpack": "^2.6.0", "postcss-import": "^11.1.0", "postcss-loader": "^2.1.6", "postcss-url": "^7.3.2", "progress-bar-webpack-plugin": "^2.1.0", "sass": "^1.49.0", "sass-loader": "^7.1.0", "style-loader": "^0.23.0", "terser-webpack-plugin": "^4.2.3", "thread-loader": "^3.0.4", "uglifyjs-webpack-plugin": "^2.0.1", "url-loader": "^1.1.1", "vite": "2.3.7", "vite-plugin-html": "^2.1.1", "vite-plugin-imp": "^2.0.11", "vite-plugin-pagedata": "^1.0.4", "vite-plugin-vue2": "^1.9.0", "vue-loader": "^15.4.2", "vue-template-compiler": "^2.6.14", "webpack": "^4.46.0", "webpack-cli": "^4.9.2", "webpack-dev-server": "^3.11.3", "webpack-merge": "^4.1.4" }, "dependencies": { "axios": "^0.24.0", "babel-polyfill": "^6.26.0", "canvas": "^2.9.0", "classnames": "^2.3.1", "deep-lu-trans": "^1.0.5", "echarts": "^5.2.2", "echarts-liquidfill": "^3.1.0", "element-ui": "^2.15.7", "enquire.js": "^2.1.6", "font-awesome": "^4.7.0", "hi-taskcenter": "^1.0.9", "hi-ui": "^1.1.1006", "html2canvas": "^1.4.1", "jquery": "^3.6.0", "js-cookie": "^3.0.1", "js-md5": "^0.7.3", "js-pinyin": "^0.1.9", "jspdf": "^2.5.1", "lodash": "^4.17.11", "qrcodejs2": "0.0.2", "screenfull": "^6.0.0", "sortablejs": "^1.14.0", "v-clipboard": "^2.2.3", "vue": "^2.6.14", "vue-draggable-resizable": "^2.3.0", "vue-gemini-scrollbar": "^2.0.1", "vue-i18n": "^8.27.0", "vue-jstree": "^2.1.6", "vue-qr": "^3.2.4", "vue-router": "^3.0.1", "vuex": "^3.6.2", "xlsx": "^0.18.5", "zhc-birt-cmps": "2.8.63", "zhc-birt-core": "^1.9.0", "zhc-flowchart": "^1.0.20" } }
Ignore Space
Show notes
View
vite.config.js
// vite.config.js 利害浏览器自带的 es 动态导入,使项目冷启动 const { resolve } = require('path'); import { defineConfig, loadEnv } from 'vite' import { createVuePlugin } from "vite-plugin-vue2"; import vueJsx from '@vitejs/plugin-vue-jsx' import pageData from "vite-plugin-pagedata" import vitefunc from './vite-plugin/vite-plugin-func' import { injectHtml } from 'vite-plugin-html'; //影响到eap.umd.min.js 里的require ELEMENT 全局 // import requireTransform from 'vite-plugin-require-transform'; const pkg = require("./package.json"); // https://vitejs.dev/config/ export default ({ mode }) => { process.env = { ...process.env, ...loadEnv(mode, process.cwd()) }; let aliases = {} let build = { sourcemap: false, //编译 //指定 多个 .html 文件作为入口点 rollupOptions: { // 请确保外部化那些你的库中不需要的依赖 // external: ['vue'], input: { main: resolve(__dirname, 'index.html'), nested: resolve(__dirname, 'nested/index.html') }, output: { format: 'umd', } } } if (mode == 'development') { aliases = { '@project': resolve(`${pkg.name == 'hi-vui-template' ? 'project' : pkg.name}`), '@main': resolve(`${pkg.name == 'hi-vui-template' ? 'project' : pkg.name}/hivuiMain`), '@birt': resolve(`${pkg.name == 'hi-vui-template' ? 'project' : pkg.name}/hivuiBirt`), 'pinyin': 'js-pinyin', //开启下面注释,scp5.0本地调式指定 //'@':resolve(__dirname, './hi-ui/src'), } // console.log('aliases@main:', aliases['@main']); } else { } const postDataName = "scpRequestData"; return defineConfig({ //预览时,预编译这些包,以防vite 启动后,浏览器通过自动模块加载导致刷新页面 optimizeDeps:{ include: [ 'vue','vue-router','vuex','@vue/babel-helper-vue-jsx-merge-props','vue-i18n', 'pinyin','lodash','js-cookie','axios','js-md5','classnames','js-pinyin','enquire.js','screenfull','sortablejs', 'lodash/findIndex','lodash/cloneDeep','lodash/isPlainObject','lodash/defaultsDeep','lodash/bind', 'umy-ui','xlsx', 'echarts', 'echarts-liquidfill/src/liquidFill.js', 'v-clipboard','vue-jstree', 'vue-gemini-scrollbar','vue-draggable-resizable', 'element-ui','element-ui/lib/locale', 'element-ui/lib/locale/lang/en', 'element-ui/lib/locale/lang/zh-CN', 'element-ui/lib/locale/lang/es', 'hi-ui', 'hi-taskcenter', "zhc-flowchart", "zhc-birt-core", 'zhc-birt-cmps' ] }, build: build, define: { 'process.env': { //配合 webpack 环境,在vite 下定义一个空的 } }, css: { preprocessorOptions: { less: { javascriptEnabled: true, } }, }, resolve: { extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue', '.dtvevt', '.dtv','.dvue','.es6'], alias: aliases, }, plugins: [ // PkgConfig(), // OptimizationPersist(), vitefunc({ varName: postDataName, global: { env: 'dev' }, htmlWebpackPlugin: { vite: true, project: pkg.name, mode: mode } }), injectHtml({ // 向预览时注入变量,这个变量跟打包时 html-webpack-plugin 注入的一致,用户判断是否是编译状态 injectData: { htmlWebpackPlugin: { vite: true, project: pkg.name, mode: mode } } }), pageData({ varName: postDataName, global: { env: 'dev' }, }), createVuePlugin({ include:/\.(dvue|vue)$/ }), vueJsx({ // options are passed on to @vue/babel-plugin-jsx }), //影响到eap.umd.min.js 里的require ELEMENT 全局 // requireTransform({ // fileRegex:/.ts$|.tsx$|.vue$|.js$|.jsx$/ // }) ], // devServer: { // port: 227, // proxy: 'http://192.168.1.183:5001/' // }, // server: { // watch: { // ignored: ['!**/node_modules/vue/**'] // } // }, // // 被监听的包必须被排除在优化之外, // // 以便它能出现在依赖关系图中并触发热更新。 // optimizeDeps: { // exclude: ['vue'] // } }) };
// vite.config.js 利害浏览器自带的 es 动态导入,使项目冷启动 const { resolve } = require('path'); import { defineConfig, loadEnv } from 'vite' import { createVuePlugin } from "vite-plugin-vue2"; import vueJsx from '@vitejs/plugin-vue-jsx' import pageData from "vite-plugin-pagedata" import vitefunc from './vite-plugin/vite-plugin-func' import { injectHtml } from 'vite-plugin-html'; //影响到eap.umd.min.js 里的require ELEMENT 全局 // import requireTransform from 'vite-plugin-require-transform'; const pkg = require("./package.json"); // https://vitejs.dev/config/ export default ({ mode }) => { process.env = { ...process.env, ...loadEnv(mode, process.cwd()) }; let aliases = {} let build = { sourcemap: false, //编译 //指定 多个 .html 文件作为入口点 rollupOptions: { // 请确保外部化那些你的库中不需要的依赖 // external: ['vue'], input: { main: resolve(__dirname, 'index.html'), nested: resolve(__dirname, 'nested/index.html') }, output: { format: 'umd', } } } if (mode == 'development') { aliases = { '@project': resolve(`${pkg.name == 'hi-vui-template' ? 'project' : pkg.name}`), '@main': resolve(`${pkg.name == 'hi-vui-template' ? 'project' : pkg.name}/hivuiMain`), '@birt': resolve(`${pkg.name == 'hi-vui-template' ? 'project' : pkg.name}/hivuiBirt`), 'pinyin': 'js-pinyin', //开启下面注释,scp5.0本地调式指定 //'@':resolve(__dirname, './hi-ui/src'), } // console.log('aliases@main:', aliases['@main']); } else { } const postDataName = "scpRequestData"; return defineConfig({ build: build, define: { 'process.env': { //配合 webpack 环境,在vite 下定义一个空的 } }, css: { preprocessorOptions: { less: { javascriptEnabled: true, } }, }, resolve: { extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue', '.dtvevt', '.dtv','.dvue','.es6'], alias: aliases, }, plugins: [ vitefunc({ varName: postDataName, global: { env: 'dev' }, htmlWebpackPlugin: { vite: true, project: pkg.name, mode: mode } }), injectHtml({ // 向预览时注入变量,这个变量跟打包时 html-webpack-plugin 注入的一致,用户判断是否是编译状态 injectData: { htmlWebpackPlugin: { vite: true, project: pkg.name, mode: mode } } }), pageData({ varName: postDataName, global: { env: 'dev' }, }), createVuePlugin({ include:/\.(dvue|vue)$/ }), vueJsx({ // options are passed on to @vue/babel-plugin-jsx }), //影响到eap.umd.min.js 里的require ELEMENT 全局 // requireTransform({ // fileRegex:/.ts$|.tsx$|.vue$|.js$|.jsx$/ // }) ], // devServer: { // port: 227, // proxy: 'http://192.168.1.183:5001/' // }, // server: { // watch: { // ignored: ['!**/node_modules/vue/**'] // } // }, // // 被监听的包必须被排除在优化之外, // // 以便它能出现在依赖关系图中并触发热更新。 // optimizeDeps: { // exclude: ['vue'] // } }) };
Show line notes below