hw-weapp-compiler 1.0.22 → 1.0.24

package/README.md

@@ -1,119 +1,80 @@
-# hw-weapp-compiler
+# weapp-compiler
 
-基于 webpack 5 的原生微信小程序构建工具，支持 JavaScript、Less、WXML、WXS、分包、npm 组件和可选的 OBS/OSS 静态资源上传。
 
-## 环境要求
+## 版本改动
 
-- Node.js 18～24
-- 项目源码位于 `src/`
-- 必须存在 `src/app.json` 和 `src/app.js`
+1. **OpenSSL 3.0 兼容**: Node.js >= 17 时自动注入 `--openssl-legacy-provider`
+2. **wxml-loader 空值守卫**: `loadModule` 失败时不再崩溃
 
 ## 安装
 
 ```bash
-npm install hw-weapp-compiler@1 -D
-```
-
-升级版本后如果出现 `Cannot find module`，请删除业务项目中旧的安装产物并重新执行 `npm install`，确保传递依赖与 lockfile 同步。
-
-在业务项目的 `package.json` 中添加：
-
-```json
-{
-  "scripts": {
-    "dev": "hw-weapp dev",
-    "build": "hw-weapp build"
-  }
-}
+npm i weapp-compiler@2.x -D
 ```
 
 ## 使用
 
 ```bash
-# 开发监听，默认 development
-npm run dev
-
-# 指定预发或生产业务环境
-npm run dev -- --simulation
-npm run dev -- --production
-
-# 生产构建，默认 production
-npm run build
-npm run build -- --development
-npm run build -- --simulation
+# 开发调试
+npm run dev        # 测试环境
+npm run dev -s     # 预发环境
+npm run dev -p     # 生产环境
+
+# 生产发布
+npm run build -d   # 测试环境
+npm run build -s   # 预发环境
+npm run build      # 生产环境
 ```
 
-可用选项：
-
-- `-d, --development`：测试环境
-- `-s, --simulation`：预发环境
-- `-p, --production`：生产环境
-- `-a, --analyzer`：打开 webpack bundle analyzer
-- `-q, --quiet`：关闭 webpack 进度输出
-
-最终环境会通过 `process.env.BUILD_ENV` 注入代码，并记录到 `dist/weapp.env.json`。
-
 ## 配置
 
-在项目根目录创建 `.weapp.js`，最小配置为：
-
-```js
-module.exports = {};
-```
-
-完整示例：
+项目根目录下创建 `.weapp.js`：
 
 ```js
 const path = require('path');
 
 module.exports = {
+  // 路径别名
   alias: {
     '@utils': path.resolve(__dirname, 'src/utils'),
+    '@config': path.resolve(__dirname, 'src/config'),
   },
+  // 资源公共路径
   publicPath: 'https://cdn.example.com/weapp/',
-  copyFiles: [
-    { from: 'images', to: 'images' },
-  ],
-};
-```
-
-## 静态资源上传
-
-上传是可选功能，只能配置 OBS 或 OSS 中的一种。生产构建会等待上传完成，任何上传失败都会让构建失败；编译失败时不会上传半成品。
-
-建议从环境变量读取凭据，避免把密钥提交到仓库：
-
-```js
-module.exports = {
-  obsConfig: process.env.OBS_ACCESS_KEY_ID
-    ? {
-        access_key_id: process.env.OBS_ACCESS_KEY_ID,
-        secret_access_key: process.env.OBS_SECRET_ACCESS_KEY,
-        server: process.env.OBS_SERVER,
-        bucket: process.env.OBS_BUCKET,
-        dir: 'weapp',
-      }
-    : undefined,
+  // 要同步的目录
+  copyFiles: [{
+    from: 'images',
+    to: 'images',
+  }],
+  // OBS 或 OSS 配置（二选一）
+  obsConfig: {
+    access_key_id: 'XXX',
+    secret_access_key: 'XXX',
+    server: 'XXX',
+    bucket: 'XXX',
+    dir: 'weapp',
+    // 可选：单次 SDK 请求超时、重试次数，以及编译器无进展兜底超时（秒）
+    timeout: 15,
+    max_retry_count: 1,
+    operation_timeout: 35,
+  },
+  ossConfig: {
+    region: '<Your region>',
+    accessKeyId: '<Your AccessKeyId>',
+    accessKeySecret: '<Your AccessKeySecret>',
+    bucket: '<Your Bucket>',
+    dir: 'weapp',
+  },
 };
 ```
 
-OSS 配置字段为 `region`、`accessKeyId`、`accessKeySecret`、`bucket` 和 `dir`。
-
-## 开发监听限制
-
-修改已有文件可以正常增量构建。开发监听期间新增页面、组件、分包，或后创建同名 `.less`、`.wxss`、`.wxml`、`.json` 文件后，需要重新启动 `dev`。生产 `build` 每次都会重新读取完整项目配置。
-
-## 微信开发者工具配置
-
-如果资源使用 CDN 上传，可以在 `src/project.config.json` 中忽略本地产物：
+在 `project.config.json` 中忽略构建产物：
 
 ```json
-{
-  "packOptions": {
-    "ignore": [
-      { "type": "folder", "value": "assets" },
-      { "type": "regexp", "value": "\\.map$" }
-    ]
-  }
+"packOptions": {
+  "ignore": [
+    { "type": "folder", "value": "assets" },
+    { "type": "regexp", "value": "\\.map$" }
+  ]
 }
 ```

package/build/config/getConfig.js

@@ -56,9 +56,6 @@ ossConfig: {
 `),
   );
 }
-if (config.obsConfig && config.ossConfig) {
-  throw new TypeError('.weapp.js 不能同时配置 obsConfig 和 ossConfig');
-}
 const alias = {
   ...(config.alias || {}),
 };

package/build/dev.js

@@ -1,5 +1,4 @@
 const webpack = require('webpack');
-const chalk = require('chalk');
 const { ENV } = require('./config/constants');
 const webpackConfig = require('./webpack.config');
 const { createCompilerHandler } = require('./utils/createCompilerHandler');
@@ -21,7 +20,7 @@ module.exports = async (opts) => {
     ),
   );
 
-  const watching = compiler.watch(
+  compiler.watch(
     {
       aggregateTimeout: 300,
       poll: false,
@@ -29,9 +28,4 @@ module.exports = async (opts) => {
     },
     createCompilerHandler('dev'),
   );
-
-  if (!opts || opts.quiet !== true) {
-    console.log(chalk.cyan('dev 正在监听文件变化'));
-  }
-  return watching;
 };

package/build/loader/wxml-loader.js

@@ -34,14 +34,12 @@ module.exports = async function loader(source) {
       return src ? [attr, src] : null;
     }),
   );
-  // 路径可能互为后缀（如 a.png 与 icons/a.png），必须先替换较长路径，
-  // 否则短路径会破坏尚未处理的长路径。
-  const resolvedAssets = assetResults
-    .filter(Boolean)
-    .sort(([left], [right]) => right.length - left.length);
-  for (let index = 0; index < resolvedAssets.length; index += 1) {
-    const [attr, src] = resolvedAssets[index];
-    content = content.split(attr).join(withPublicPath(src));
+  for (let index = 0; index < assetResults.length; index += 1) {
+    const result = assetResults[index];
+    if (result) {
+      const [attr, src] = result;
+      content = content.split(attr).join(withPublicPath(src));
+    }
   }
 
   // wxml文件 - 并行 loadModule

package/build/plugin/index.js

@@ -9,25 +9,10 @@ const { RawSource } = require('webpack-sources');
 
 const { addToUploadQueue } = require('../utils/upload');
 const { compatiblePath } = require('../utils/compatiblePath');
-const { ENV, PATTERNS, ASSET_EXT_PATTERN, ASSETS_DIR } = require('../config/constants');
+const { PATTERNS, ASSET_EXT_PATTERN, ASSETS_DIR } = require('../config/constants');
 
 const pluginName = 'WeappCompilerPlugin';
 
-async function uploadCompilationAssets(stats, compiler, assets, upload = addToUploadQueue) {
-  if (stats.hasErrors() || assets.length === 0) {
-    return;
-  }
-
-  try {
-    await upload(assets);
-  } catch (error) {
-    if (compiler.options.mode === ENV.PROD) {
-      throw error;
-    }
-    compiler.getInfrastructureLogger(pluginName).error(error);
-  }
-}
-
 /**
  * 检测产物中存在哪些公共模块和分包模块
  */
@@ -91,19 +76,13 @@ function injectGlobalModules(content, assetName, flags) {
 
   // runtime 暴露到全局
   if (assetName === 'runtime.js') {
-    const runtimeCachePattern = /\b(var|let|const)\s+__webpack_module_cache__\s*=\s*\{\};/;
-    if (!runtimeCachePattern.test(result)) {
-      throw new Error(
-        '无法注入微信小程序 runtime：当前 webpack 产物中缺少 module cache 标记，请检查 webpack 版本',
-      );
-    }
     result = result.replace(
-      runtimeCachePattern,
-      (statement, declaration) => `
+      'var __webpack_module_cache__ = {};',
+      `
         if (!global.__webpack_module_cache__) {
           global.__webpack_module_cache__ = {};
         }
-        ${declaration} __webpack_module_cache__ = global.__webpack_module_cache__;
+        var __webpack_module_cache__ = global.__webpack_module_cache__;
         global.__webpack_require__ = __webpack_require__;
       `,
     );
@@ -116,13 +95,13 @@ function injectGlobalModules(content, assetName, flags) {
       'Function("r", "regeneratorRuntime = r")(runtime);',
       'global.regeneratorRuntime = runtime',
     );
-    if (!result.includes("require('./commons.js');") && flags.hasCommonJs) {
+    if (!/require('\.\/commons\.js')/.test(result) && flags.hasCommonJs) {
       result = `require('./commons.js');\n${result}`;
     }
-    if (!result.includes("require('./vendors.js');") && flags.hasVendorJs) {
+    if (!/require('\.\/vendors\.js')/.test(result) && flags.hasVendorJs) {
       result = `require('./vendors.js');\n${result}`;
     }
-    if (!result.includes("require('./runtime.js');") && flags.hasRuntimeJs) {
+    if (!/require('\.\/runtime\.js')/.test(result) && flags.hasRuntimeJs) {
       result = `require('./runtime.js');\n${result}`;
     }
   }
@@ -188,10 +167,9 @@ class WeappPlugin {
   apply(compiler) {
     let obsAssets = [];
 
-    compiler.hooks.done.tapPromise(pluginName, async (stats) => {
-      const assets = Array.from(new Set(obsAssets));
+    compiler.hooks.done.tap(pluginName, () => {
+      addToUploadQueue([...obsAssets]);
       obsAssets = [];
-      await uploadCompilationAssets(stats, compiler, assets);
     });
 
     compiler.hooks.compilation.tap(pluginName, (compilation) => {
@@ -250,7 +228,3 @@ class WeappPlugin {
 }
 
 module.exports = WeappPlugin;
-module.exports._internals = {
-  injectGlobalModules,
-  uploadCompilationAssets,
-};

package/build/prod.js

@@ -3,7 +3,7 @@ const TerserPlugin = require('terser-webpack-plugin');
 const CssMinimizerPlugin = require('css-minimizer-webpack-plugin');
 const { ENV } = require('./config/constants');
 const webpackConfig = require('./webpack.config');
-const { createCompilerHandler, runCompilerOnce } = require('./utils/createCompilerHandler');
+const { createCompilerHandler } = require('./utils/createCompilerHandler');
 
 module.exports = async (opts) => {
   // 生产环境禁用 filesystem cache，与 dev 同源：output.clean 后复用旧缓存会导致副作用产物漏生成，
@@ -16,7 +16,7 @@ module.exports = async (opts) => {
         devtool: false,
         output: {
           clean: {
-            keep: /^weapp\.env\.json$/,
+            keep: /^(project\.config\.json|weapp\.env\.json)$/,
           },
         },
         optimization: {
@@ -34,5 +34,5 @@ module.exports = async (opts) => {
     ),
   );
 
-  await runCompilerOnce(compiler, createCompilerHandler('build'));
+  compiler.run(createCompilerHandler('build'));
 };

package/build/utils/cleanDistForDev.js

@@ -2,7 +2,7 @@ const path = require('path');
 const fse = require('fs-extra');
 const { DIST_DIR } = require('../config/constants');
 
-const KEEP_FILES = new Set(['weapp.env.json']);
+const KEEP_FILES = new Set(['project.config.json', 'weapp.env.json']);
 
 /**
  * 开发模式启动时清理 dist 旧产物。

package/build/utils/createCompilerHandler.js

@@ -48,26 +48,6 @@ function createCompilerHandler(label, { failOnError = label === 'build' } = {})
   };
 }
 
-/**
- * 运行一次 webpack 编译，并等待异步 done 钩子及 compiler.close 完成。
- * 上传任务挂在 done.tapPromise 上，生产命令必须等待这里结束，才能可靠输出上传错误。
- */
-function runCompilerOnce(compiler, handler) {
-  return new Promise((resolve, reject) => {
-    compiler.run((runError, stats) => {
-      compiler.close((closeError) => {
-        try {
-          handler(runError || closeError, stats);
-          resolve(stats);
-        } catch (error) {
-          reject(error);
-        }
-      });
-    });
-  });
-}
-
 module.exports = {
   createCompilerHandler,
-  runCompilerOnce,
-};
+};

package/build/utils/getWxmlAssets.js

@@ -3,43 +3,27 @@ const path = require('path');
 const fse = require('fs-extra');
 const { ASSET_EXT_PATTERN, PATTERNS, SRC_DIR } = require('../config/constants');
 
-function extractStyleUrls(style) {
-  const urls = [];
-  const urlPattern = /url\(\s*(?:(['"])(.*?)\1|([^)]*?))\s*\)/gi;
-  let match;
-
-  // eslint-disable-next-line no-cond-assign
-  while ((match = urlPattern.exec(style)) !== null) {
-    const value = (match[2] !== undefined ? match[2] : match[3]).trim();
-    if (value) {
-      urls.push(value);
-    }
-  }
-  return urls;
-}
-
 function getWxmlAssets(filePath, content) {
   const resolvePath = (attr, dir) => {
-    return new Promise((resolve, reject) => {
+    return new Promise((resolve) => {
       const isAbsolutePath = PATTERNS.ABSOLUTE_PATH.test(attr);
       const request = isAbsolutePath ? attr.replace(PATTERNS.ABSOLUTE_PATH, '') : attr;
       const resolveContext = isAbsolutePath ? SRC_DIR : dir;
 
       this.resolve(resolveContext, request, async (err, result) => {
-        try {
-          let res = result;
-          if (err) {
-            const fallbackPath = path.resolve(resolveContext, request);
+        let res = result;
+        if (err) {
+          const fallbackPath = path.resolve(resolveContext, request);
 
-            if (await fse.pathExists(fallbackPath)) {
-              res = fallbackPath;
-            } else {
-              this.emitError(err);
-            }
+          if (await fse.pathExists(fallbackPath)) {
+            res = fallbackPath;
+            resolve(res);
+          } else {
+            this.emitError(err);
+            resolve(res);
           }
+        } else {
           resolve(res);
-        } catch (error) {
-          reject(error);
         }
       });
     });
@@ -47,7 +31,8 @@ function getWxmlAssets(filePath, content) {
   return new Promise((resolve, reject) => {
     let allAttrs = [];
     const parser = new htmlparser2.Parser({
-      onopentag: (name, attributes) => {
+      onopentag: async (name, attributes) => {
+        const reg = /url\(.*\)/g;
         const { style } = attributes;
 
         allAttrs = allAttrs.concat(
@@ -58,55 +43,60 @@ function getWxmlAssets(filePath, content) {
         );
 
         if (style) {
-          allAttrs = allAttrs.concat(extractStyleUrls(style));
+          const styles = attributes.style.split(';');
+          styles.forEach((styleItem) => {
+            (styleItem.match(reg) || []).forEach((item) => {
+              allAttrs.push(
+                item
+                  .replace(/^(url\(”)/g, '')
+                  .replace(/^(url\(')/g, '')
+                  .replace(/^(url\()/g, '')
+                  .replace(/(“\)|'\)|\))$/g, ''),
+              );
+            });
+          });
         }
       },
       onerror: (err) => {
         reject(err);
       },
       onend: async () => {
-        try {
-          const filteredAttrs = allAttrs
-            .filter((item) => !!item)
-            .map((item) => item.split('?')[0])
-            // http(s)、cloud、wxfile、data 等带协议资源均由小程序运行时处理，
-            // 只有本地相对路径、根路径和 webpack alias 才进入 resolver。
-            .filter((item) => !/^(?:[a-z][a-z\d+.-]*:|\/\/)/i.test(item))
-            .filter((item) => !/{{.*}}/.test(item))
-            .filter((item) => !/\+.*\+/.test(item));
+        const filteredAttrs = allAttrs
+          .filter((item) => !!item)
+          .map((item) => item.split('?')[0])
+          .filter((item) => !/^(http:|https:)/.test(item))
+          .filter((item) => !/{{.*}}/.test(item))
+          .filter((item) => !/\+.*\+/.test(item));
 
-          const assets = filteredAttrs.filter((item) => ASSET_EXT_PATTERN.test(item));
-          const wxmls = filteredAttrs.filter((item) => PATTERNS.WXS_EXT.test(item) || PATTERNS.WXML_EXT.test(item));
+        const assets = filteredAttrs.filter((item) => ASSET_EXT_PATTERN.test(item));
+        const wxmls = filteredAttrs.filter((item) => PATTERNS.WXS_EXT.test(item) || PATTERNS.WXML_EXT.test(item));
 
-          const assetsImports = [];
-          const wxmlsImports = [];
+        const assetsImports = [];
+        const wxmlsImports = [];
 
-          // 并行解析 wxml 路径
-          const wxmlResults = await Promise.all(
-            wxmls.map(async (attr) => {
-              const result = await resolvePath(attr, path.parse(filePath).dir);
-              return result ? [attr, result] : null;
-            }),
-          );
-          for (let index = 0; index < wxmlResults.length; index += 1) {
-            if (wxmlResults[index]) wxmlsImports.push(wxmlResults[index]);
-          }
-
-          // 并行解析 asset 路径
-          const assetResults = await Promise.all(
-            assets.map(async (attr) => {
-              const result = await resolvePath(attr, path.parse(filePath).dir);
-              return result ? [attr, result] : null;
-            }),
-          );
-          for (let index = 0; index < assetResults.length; index += 1) {
-            if (assetResults[index]) assetsImports.push(assetResults[index]);
-          }
+        // 并行解析 wxml 路径
+        const wxmlResults = await Promise.all(
+          wxmls.map(async (attr) => {
+            const result = await resolvePath(attr, path.parse(filePath).dir);
+            return result ? [attr, result] : null;
+          }),
+        );
+        for (let index = 0; index < wxmlResults.length; index += 1) {
+          if (wxmlResults[index]) wxmlsImports.push(wxmlResults[index]);
+        }
 
-          resolve([assetsImports, wxmlsImports]);
-        } catch (error) {
-          reject(error);
+        // 并行解析 asset 路径
+        const assetResults = await Promise.all(
+          assets.map(async (attr) => {
+            const result = await resolvePath(attr, path.parse(filePath).dir);
+            return result ? [attr, result] : null;
+          }),
+        );
+        for (let index = 0; index < assetResults.length; index += 1) {
+          if (assetResults[index]) assetsImports.push(assetResults[index]);
         }
+
+        resolve([assetsImports, wxmlsImports]);
       },
     });
     parser.write(content);
@@ -116,5 +106,4 @@ function getWxmlAssets(filePath, content) {
 
 module.exports = {
   getWxmlAssets,
-  extractStyleUrls,
 };

package/build/utils/storage.js

@@ -4,40 +4,18 @@ const { debounce } = require('throttle-debounce');
 
 const tempDir = path.resolve(process.cwd(), '.temp');
 const uploadJsonDir = path.join(tempDir, 'upload.json');
-const uploadJsonTempDir = `${uploadJsonDir}.${process.pid}.tmp`;
 let uploadJson = {};
+const writeUploadJsonDebounce = debounce(300, () => {
+  fs.writeJSONSync(uploadJsonDir, uploadJson);
+});
 
-function writeUploadJson() {
-  try {
-    fs.writeJSONSync(uploadJsonTempDir, uploadJson);
-    fs.renameSync(uploadJsonTempDir, uploadJsonDir);
-  } catch (error) {
-    try {
-      fs.removeSync(uploadJsonTempDir);
-    } catch (cleanupError) {
-      console.warn('清理上传缓存临时文件失败：', cleanupError);
-    }
-    console.warn('写入上传缓存失败，本次构建将继续：', error);
-  }
+if (!fs.existsSync(tempDir)) {
+  fs.mkdirSync(tempDir);
 }
-
-const writeUploadJsonDebounce = debounce(300, writeUploadJson);
-
-fs.ensureDirSync(tempDir);
 if (!fs.existsSync(uploadJsonDir)) {
-  writeUploadJson();
+  fs.writeJSONSync(uploadJsonDir, uploadJson);
 } else {
-  try {
-    const stored = fs.readJSONSync(uploadJsonDir);
-    if (!stored || Array.isArray(stored) || typeof stored !== 'object') {
-      throw new TypeError('上传缓存必须是 JSON 对象');
-    }
-    uploadJson = stored;
-  } catch (error) {
-    console.warn('上传缓存已损坏，将重建缓存：', error);
-    uploadJson = {};
-    writeUploadJson();
-  }
+  uploadJson = fs.readJSONSync(uploadJsonDir);
 }
 
 module.exports = {