From 49454f9ee001e3e500eaa7319cfa9701403cb947 Mon Sep 17 00:00:00 2001 From: Xc Date: Wed, 14 Feb 2024 13:34:32 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E4=BA=86webpack=E7=9A=84?= =?UTF-8?q?=E5=88=9D=E5=A7=8B=E5=8C=96=E8=BF=87=E7=A8=8B=EF=BC=8C=E5=A2=9E?= =?UTF-8?q?=E5=8A=A0=E4=BA=86=E6=B3=A8=E5=85=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- config/web/paths.js | 2 +- config/web/webpack.config.js | 418 +++++++++++++++-------------- template/configuration/compiler.js | 12 + template/src/features/Menu.ts | 110 ++++++++ 4 files changed, 338 insertions(+), 204 deletions(-) create mode 100644 template/configuration/compiler.js create mode 100644 template/src/features/Menu.ts diff --git a/config/web/paths.js b/config/web/paths.js index 88910f0..d51db84 100644 --- a/config/web/paths.js +++ b/config/web/paths.js @@ -81,7 +81,7 @@ const resolveModule = (resolveFn, filePath) => { return resolveFn(`${filePath}.js`); }; -// config after eject: we're in ./config/ +// config after eject: we're in ./web module.exports = { dotenv: resolveApp('.env'), appPath: resolveApp('.'), diff --git a/config/web/webpack.config.js b/config/web/webpack.config.js index ed8bfe4..94df1b4 100644 --- a/config/web/webpack.config.js +++ b/config/web/webpack.config.js @@ -205,15 +205,20 @@ module.exports = function (webpackEnv) { return loaders; }; + // 读取编译配置 + const compilerConfigurationFile = path.join(paths.appRootPath, 'configuration', 'compiler.js'); + const projectConfigration = fs.existsSync(compilerConfigurationFile) && require(compilerConfigurationFile).webpack; + const getOakInclude = () => { - return [ - /oak-domain/, - /oak-external-sdk/, + const result = [ /oak-frontend-base/, /oak-general-business/, - /oak-memory-tree-store/, - /oak-common-aspect/, ]; + if (projectConfigration && projectConfigration.extraOakModules) { + result.push(...projectConfigration.extraOakModules); + } + + return result; }; return { @@ -255,14 +260,14 @@ module.exports = function (webpackEnv) { // Point sourcemap entries to original disk location (format as URL on Windows) devtoolModuleFilenameTemplate: isEnvProduction ? (info) => - path - .relative(paths.appSrc, info.absoluteResourcePath) - .replace(/\\/g, '/') + path + .relative(paths.appSrc, info.absoluteResourcePath) + .replace(/\\/g, '/') : isEnvDevelopment && - ((info) => - path - .resolve(info.absoluteResourcePath) - .replace(/\\/g, '/')), + ((info) => + path + .resolve(info.absoluteResourcePath) + .replace(/\\/g, '/')), }, cache: { type: 'filesystem', @@ -369,18 +374,24 @@ module.exports = function (webpackEnv) { }, }, resolve: { - fallback: { - crypto: require.resolve('crypto-browserify'), - buffer: require.resolve('safe-buffer'), - stream: require.resolve('stream-browserify'), - zlib: require.resolve('browserify-zlib'), - querystring: require.resolve('querystring-es3'), - url: false, - path: false, - fs: false, - net: false, - tls: false, - }, + fallback: (() => { + const defaultFb = { + crypto: require.resolve('crypto-browserify'), + buffer: require.resolve('safe-buffer'), + stream: require.resolve('stream-browserify'), + zlib: require.resolve('browserify-zlib'), + querystring: require.resolve('querystring-es3'), + url: false, + path: false, + fs: false, + net: false, + tls: false, + } + if (projectConfigration && projectConfigration.resolve && projectConfigration.resolve.fallback) { + Object.assign(defaultFb, projectConfigration.resolve.fallback); + } + return defaultFb; + })(), // This allows you to set a fallback for where webpack should look for modules. // We placed these paths second because we want `node_modules` to "win" // if there are any conflicts. This matches Node resolution mechanism. @@ -397,24 +408,25 @@ module.exports = function (webpackEnv) { extensions: paths.moduleFileExtensions .map((ext) => `.${ext}`) .filter((ext) => useTypeScript || !ext.includes('ts')), - alias: { - // Support React Native Web - // https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/ - 'react-native': 'react-native-web', - // Allows for better profiling with ReactDevTools - ...(isEnvProductionProfile && { - 'react-dom$': 'react-dom/profiling', - 'scheduler/tracing': 'scheduler/tracing-profiling', - }), - ...(modules.webpackAliases || {}), - '@': paths.appSrc, - '@project': paths.appRootSrc, - '@oak-general-business': paths.oakGeneralBusinessPath, - '@oak-frontend-base': paths.oakFrontendBasePath, - '@oak-app-domain': paths.oakAppDomainPath, - 'bn.js': require.resolve('bn.js'), - assert: require.resolve('browser-assert'), - }, + alias: (() => { + const defaultAlias = { + // Support React Native Web + // https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/ + 'react-native': 'react-native-web', + // Allows for better profiling with ReactDevTools + ...(isEnvProductionProfile && { + 'react-dom$': 'react-dom/profiling', + 'scheduler/tracing': 'scheduler/tracing-profiling', + }), + ...(modules.webpackAliases || {}), + 'bn.js': require.resolve('bn.js'), + assert: require.resolve('browser-assert'), + }; + if (projectConfigration && projectConfigration.resolve && projectConfigration.resolve.alias) { + Object.assign(defaultAlias, projectConfigration.resolve.alias); + } + return defaultAlias; + })(), plugins: [ // Prevents users from importing files from outside of src/ (or node_modules/). // This often causes confusion because we only process files within src/ with babel. @@ -541,10 +553,10 @@ module.exports = function (webpackEnv) { plugins: [ isEnvDevelopment && - shouldUseReactRefresh && - require.resolve( - 'react-refresh/babel' - ), + shouldUseReactRefresh && + require.resolve( + 'react-refresh/babel' + ), oakPathTsxPlugin, oakRenderTsxPlugin, // oakRouterPlugin, @@ -759,14 +771,14 @@ module.exports = function (webpackEnv) { }, plugins: [ isEnvProduction && - new CompressionWebpackPlugin({ - filename: '[path][base].gz', //压缩后的文件名 - algorithm: 'gzip', //压缩格式 有：gzip、brotliCompress - test: /\.(js|css|svg)$/, - threshold: 10240, // 只处理比这个值大的资源，按字节算 - minRatio: 0.8, //只有压缩率比这个值小的文件才会被处理，压缩率=压缩大小/原始大小，如果压缩后和原始文件大小没有太大区别，就不用压缩 - deleteOriginalAssets: false, //是否删除原文件，最好不删除，服务器会自动优先返回同名的.gzip资源，如果找不到还可以拿原始文件 - }), + new CompressionWebpackPlugin({ + filename: '[path][base].gz', //压缩后的文件名 + algorithm: 'gzip', //压缩格式 有：gzip、brotliCompress + test: /\.(js|css|svg)$/, + threshold: 10240, // 只处理比这个值大的资源，按字节算 + minRatio: 0.8, //只有压缩率比这个值小的文件才会被处理，压缩率=压缩大小/原始大小，如果压缩后和原始文件大小没有太大区别，就不用压缩 + deleteOriginalAssets: false, //是否删除原文件，最好不删除，服务器会自动优先返回同名的.gzip资源，如果找不到还可以拿原始文件 + }), // Generates an `index.html` file with the