index.ts 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138
  1. import { defineConfig, type UserConfigExport } from '@tarojs/cli';
  2. import TsconfigPathsPlugin from 'tsconfig-paths-webpack-plugin';
  3. import devConfig from './dev';
  4. import prodConfig from './prod';
  5. import path from 'path';
  6. import TerserPlugin from 'terser-webpack-plugin';
  7. import webpack, { DefinePlugin } from 'webpack';
  8. // https://taro-docs.jd.com/docs/next/config#defineconfig-辅助函数
  9. export default defineConfig<'webpack5'>(async (merge) => {
  10. const baseConfig: UserConfigExport<'webpack5'> = {
  11. projectName: 'zsis',
  12. date: '2025-5-29',
  13. designWidth: 750,
  14. deviceRatio: {
  15. 640: 2.34 / 2,
  16. 750: 1,
  17. 375: 2,
  18. 828: 1.81 / 2,
  19. },
  20. sourceRoot: 'src',
  21. outputRoot: 'dist',
  22. plugins: ['@tarojs/plugin-http'],
  23. defineConstants: {
  24. // 开发环境下使用空字符串,实际请求会自动拼接当前域名
  25. API_BASE_URL_FROM_WEBPACK: process.env.NODE_ENV === 'development' ? '""' : '"http://101.43.219.60:7700"'
  26. },
  27. copy: {
  28. patterns: [],
  29. options: {},
  30. },
  31. framework: 'react',
  32. compiler: 'webpack5',
  33. cache: {
  34. enable: false, // Webpack 持久化缓存配置,建议开启。默认配置请参考:https://docs.taro.zone/docs/config-detail#cache
  35. },
  36. mini: {
  37. postcss: {
  38. pxtransform: {
  39. enable: true,
  40. config: {},
  41. },
  42. cssModules: {
  43. enable: false, // 默认为 false,如需使用 css modules 功能,则设为 true
  44. config: {
  45. namingPattern: 'module', // 转换模式,取值为 global/module
  46. generateScopedName: '[name]__[local]___[hash:base64:5]',
  47. },
  48. },
  49. },
  50. webpackChain(chain) {
  51. chain.resolve.plugin('tsconfig-paths').use(TsconfigPathsPlugin);
  52. },
  53. },
  54. h5: {
  55. publicPath: './',
  56. staticDirectory: 'static',
  57. output: {
  58. filename: '[name].js',
  59. chunkFilename: 'js/[name].[chunkhash:8].js',
  60. },
  61. miniCssExtractPluginOption: {
  62. ignoreOrder: true,
  63. filename: 'css/[name].[fullhash].css',
  64. chunkFilename: 'css/[name].[chunkhash].css',
  65. },
  66. postcss: {
  67. autoprefixer: {
  68. enable: true,
  69. config: {},
  70. },
  71. cssModules: {
  72. enable: false, // 默认为 false,如需使用 css modules 功能,则设为 true
  73. config: {
  74. namingPattern: 'module', // 转换模式,取值为 global/module
  75. generateScopedName: '[name]__[local]___[fullhash:base64:5]',
  76. },
  77. },
  78. },
  79. webpackChain(chain) {
  80. chain.cache(false);
  81. chain.output.path(path.resolve(__dirname, '../dist/h5'));
  82. chain.optimization.minimize(false); // 彻底关闭压缩
  83. // chain.resolve.plugin('tsconfig-paths').use(TsconfigPathsPlugin);
  84. chain.resolve
  85. .plugin('tsconfig-paths')
  86. .use(TsconfigPathsPlugin, [{
  87. configFile: path.resolve(__dirname, '../tsconfig.json'), // 必须指向存在的 tsconfig
  88. }]);
  89. // 打开详细日志
  90. //chain.mode('production').stats('verbose');
  91. chain.merge({
  92. resolve: {
  93. fallback: {
  94. util: require.resolve('util/'),
  95. stream: require.resolve('stream-browserify'),
  96. fs: require.resolve('browserify-fs'),
  97. path: require.resolve('path-browserify'),
  98. },
  99. },
  100. });
  101. chain.optimization
  102. .minimizer('terser')
  103. .use(TerserPlugin, [{
  104. parallel: false, // 单线程,错误不会丢
  105. terserOptions: {
  106. compress: false, // 先不压缩,只混淆
  107. mangle: false,
  108. format: {
  109. comments: false,
  110. },
  111. },
  112. } as any]);
  113. chain.plugin('define-plugin')
  114. .use(DefinePlugin as any, [{
  115. 'process.env.USE_MSW': JSON.stringify(process.env.USE_MSW || 'false'),
  116. 'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'production'),
  117. }]);
  118. },
  119. },
  120. rn: {
  121. appName: 'taroDemo',
  122. postcss: {
  123. cssModules: {
  124. enable: false, // 默认为 false,如需使用 css modules 功能,则设为 true
  125. },
  126. },
  127. },
  128. };
  129. if (process.env.NODE_ENV === 'development') {
  130. // 本地开发构建配置(不混淆压缩)
  131. return merge({}, baseConfig, devConfig);
  132. }
  133. // 生产构建配置(默认开启压缩混淆等)
  134. return merge({}, baseConfig, prodConfig);
  135. });