新增：H5端发行后支持独立的config.js文件

index.html

@@ -4,8 +4,6 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
     <title></title>
-    <!--preload-links-->
-    <!--app-context-->
     <style>
       #app,
       uni-app,
@@ -15,6 +13,8 @@
         height: auto !important; */
       }
     </style>
+    <!--preload-links-->
+    <!--app-context-->
   </head>
   <body>
     <div id="app"><!--app-html--></div>

node_modules/.package-lock.json

@@ -3,6 +3,16 @@
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
+    "node_modules/vite-plugin-multiple-entries2": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmmirror.com/vite-plugin-multiple-entries/-/vite-plugin-multiple-entries-0.0.1.tgz",
+      "integrity": "sha512-/RzQlc1IwBo24s+ndwGhvEJcYvR1BralQRMaWokfczhrmfpi77DTctiVu2uLHoOVp+J6SQP5882XW8Aucv+nDg==",
+      "dev": true,
+      "engines": {
+        "node": ">=14.0.0",
+        "pnpm": ">=7.0.1"
+      }
+    },
     "node_modules/weixin-js-sdk": {
       "version": "1.6.0",
       "resolved": "https://registry.npmjs.org/weixin-js-sdk/-/weixin-js-sdk-1.6.0.tgz",

node_modules/vite-plugin-multiple-entries2/README.md

@@ -0,0 +1,175 @@
+# Introduction
+
+Support multiple JS(TS) entries in an HTML file, all of which can be built, and the final build products are placed in the same directory
+
+# Usage 
+
+## Base Demo
+
+```js
+import { multipleEntryFilePlugin } from 'vite-plugin-multiple-entries';
+export default defineConfig({
+  plugins: [
+    multipleEntryFilePlugin({
+      chunkName: 'other',
+      entryPath: resolve('./other.ts'),
+      injectTo: 'body-prepend',
+    }),
+  ],
+});
+```
+
+## Options
+
+### chunkName
+
+Type: `string`
+
+Default Value: `-`
+
+Required: `Yes`
+
+Description: the entry chunk name, which affects the output file name
+
+### entryPath
+
+Type: `string`
+
+Default Value: `-`
+
+Required: `Yes`
+
+Description: the entry file path
+
+### entryFileName
+
+Type: `string`
+
+Default Value: `-`
+
+Required: `No`
+
+Description: The same as rollupOptions.output.chunkFileNames, it will affect the output file name, By default, the output file name will hit options.output.entryFileNames naming logic. it will be set to the same file name as the main entry. If you want to specify the output file name, you need set pluginOptions.entryFileName in the same way as rollup.output.entryFileNames.
+### crossorigin
+
+Type: `string`
+
+Default Value: `-`
+
+Required: `No`
+
+Description: Whether to add the crossorigin field to the injected script tag
+
+Example:
+
+```js
+export default defineConfig({
+  plugins: [
+    multipleEntryFilePlugin({
+      chunkName: 'other',
+      entryPath: resolve('./other.ts'),
+      crossorigin: 'anonymous',
+    }),
+  ],
+});
+```
+
+```html
+<!doctype html>
+<html lang="zh">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta http-equiv="x-dns-prefetch-control" content="on" />
+    <script type="module" crossorigin src="/assets/index-22c3b48c.js"></script>
+  </head>
+  <body>
+    <script src="assets/other-cc41acd1.js" crossorigin="anonymous"></script>
+    <div id="app"></div>
+  </body>
+</html>
+```
+
+### injectTo
+
+Type: `'head' | 'body' | 'head-prepend' | 'body-prepend'`
+
+Default Value: `head-prepend`
+
+Required: `No`
+
+Description: Inject position, it will affect the position of the `<script>` tag in output HTML
+### insertPlaceholder
+
+Type: `string`
+
+Default Value: `-`
+
+Required: `No`
+
+Description: Inject placeholder, which will be replaced by script tag finally, and ensure that there is such content in the input HTML file
+
+Example:
+
+```html
+<!doctype html>
+<html lang="zh">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <!-- other script placeholder -->
+    <meta http-equiv="x-dns-prefetch-control" content="on" />
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="index.ts"></script>
+  </body>
+</html>
+```
+
+```javascript
+export default defineConfig({
+  plugins: [
+    multipleEntryFilePlugin({
+      chunkName: 'other',
+      entryPath: resolve('./other.ts'),
+      insertPlaceholder: '<!-- other script placeholder -->',
+    }),
+  ],
+});
+```
+
+Build result:
+
+```html
+<!doctype html>
+<html lang="zh">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <script src="/assets/other-cc41acd1.js"></script>
+    <meta http-equiv="x-dns-prefetch-control" content="on" />
+    <script type="module" crossorigin src="/assets/index-22c3b48c.js"></script>
+  </head>
+  <body>
+    <div id="app"></div>
+  </body>
+</html>
+```
+
+# Development
+## Requirements
+- Node.js
+- pnpm
+
+## DEV
+```shell
+pnpm i
+pnpm run dev:demo // for vite dev
+pnpm run build:demo // for vite build
+```
+## Build
+
+```shell
+pnpm run build
+```

node_modules/vite-plugin-multiple-entries2/dist/index.js

@@ -0,0 +1,182 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function(thisArg, _arguments, P, generator) {
+  function adopt(value) { return value instanceof P ? value : new P(function(resolve) { resolve(value); }); }
+  return new(P || (P = Promise))(function(resolve, reject) {
+    function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+
+    function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+
+    function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+    step((generator = generator.apply(thisArg, _arguments || [])).next());
+  });
+};
+var __generator = (this && this.__generator) || function(thisArg, body) {
+  var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] },
+    f, y, t, g;
+  return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] =
+function() { return this; }), g;
+
+  function verb(n) { return function(v) { return step([n, v]); }; }
+
+  function step(op) {
+    if (f) throw new TypeError("Generator is already executing.");
+    while (g && (g = 0, op[0] && (_ = 0)), _) try {
+      if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t
+          .call(y, op[1])).done) return t;
+      if (y = 0, t) op = [op[0] & 2, t.value];
+      switch (op[0]) {
+        case 0:
+        case 1:
+          t = op;
+          break;
+        case 4:
+          _.label++;
+          return { value: op[1], done: false };
+        case 5:
+          _.label++;
+          y = op[1];
+          op = [0];
+          continue;
+        case 7:
+          op = _.ops.pop();
+          _.trys.pop();
+          continue;
+        default:
+          if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+          if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+          if (op[0] === 6 && _.label < t[1]) { _.label = t[1];
+            t = op; break; }
+          if (t && _.label < t[2]) { _.label = t[2];
+            _.ops.push(op); break; }
+          if (t[2]) _.ops.pop();
+          _.trys.pop();
+          continue;
+      }
+      op = body.call(thisArg, _);
+    } catch (e) { op = [6, e];
+      y = 0; } finally { f = t = 0; }
+    if (op[0] & 5) throw op[1];
+    return { value: op[0] ? op[1] : void 0, done: true };
+  }
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.multipleEntryFilePlugin = void 0;
+
+function multipleEntryFilePlugin(pluginOptions) {
+  var chunkName = pluginOptions.chunkName,
+    entryPath = pluginOptions.entryPath,
+    insertPlaceholder = pluginOptions.insertPlaceholder,
+    crossorigin = pluginOptions.crossorigin,
+    entryFileName = pluginOptions.entryFileName,
+    _a = pluginOptions.injectTo,
+    injectTo = _a === void 0 ? 'head-prepend' : _a;
+  var filename = '';
+  var base = '';
+  var isDevServer = true;
+  return {
+    name: 'multiple-entries-plugin',
+    // Only be executed in dev mode
+    configureServer: function() {
+      // isDevServer = true;
+      // filename = entryPath;
+    },
+    // Record base path for build output file path
+    configResolved: function(resolvedConfig) {
+      base = resolvedConfig.base || '';
+    },
+    // Inject new entry
+    options: function(options) {
+      // is string
+      if (typeof options.input === 'string') {
+        options.input = [options.input, entryPath];
+      }
+      // is array
+      else if (Array.isArray(options.input)) {
+        options.input.push(entryPath);
+      }
+      // is object
+      else if (typeof options.input === 'object') {
+        options.input[chunkName] = entryPath;
+      }
+      // No entry specified, treat current entry as the only one.
+      else {
+        options.input = [entryPath];
+      }
+    },
+    /**
+     * override entryFileNames, append the new entry file name into origin.
+     * By default, it will hit options.output.entryFileNames naming logic. output file name will be set to the same file name as the main entry.
+     * If you need to specify the output file name, set pluginOptions.entryFileName in the same way as rollup.output.entryFileNames
+     */
+    outputOptions: function(options) {
+      if (!entryFileName) {
+        return;
+      }
+      if (Array.isArray(options)) {
+        throw new TypeError('Array type output not supported');
+      }
+      var oldEntryFileNames = options.entryFileNames;
+      options.entryFileNames = function(chunkInfo) {
+        // Hit the entry we added
+        if ('isEntry' in chunkInfo &&
+          chunkInfo.isEntry === true &&
+          chunkInfo.name === chunkName) {
+          return entryFileName;
+        }
+        // No entry file name specified, use roll up default value
+        else if (oldEntryFileNames === undefined) {
+          return '[name].js';
+        }
+        // Entry is a function
+        else if (typeof oldEntryFileNames === 'function') {
+          return oldEntryFileNames(chunkInfo);
+        }
+        // Entry is a string
+        else {
+          return oldEntryFileNames;
+        }
+      };
+    },
+    // Record the file name of the injected module while generateBundle
+    generateBundle: function(_, bundle) {
+      Object.values(bundle).forEach(function(bun) {
+        if ('isEntry' in bun && bun.isEntry === true && bun.name === chunkName) {
+          filename = base + bun.fileName;
+        }
+      });
+    },
+    // Inject <script> tag for added entry file
+    transformIndexHtml: function(html) {
+      return __awaiter(this, void 0, void 0, function() {
+        var injectScriptType, crossoriginAttr, tag, attrs;
+        return __generator(this, function(_a) {
+          // If there is a specified placeholder, use the placeholder first
+          if (insertPlaceholder) {
+            injectScriptType = isDevServer ? 'type="module" ' : '';
+            crossoriginAttr = crossorigin ? "crossorigin=\"".concat(crossorigin, "\" ") : '';
+            tag = "<script ".concat(injectScriptType).concat(crossoriginAttr, "src=\"").concat(filename, "\"></script>");
+            return [2 /*return*/ , html.replace(insertPlaceholder, tag)];
+          }
+          // Inject <script> tag with vite HtmlTagDescriptor
+          else {
+            attrs = {
+              src: filename,
+            };
+            if (crossorigin !== undefined) {
+              attrs.crossorigin = crossorigin;
+            }
+            if (isDevServer) {
+              attrs.type = 'module';
+            }
+            return [2 /*return*/ , {
+              html: html,
+              tags: [{ tag: 'script', attrs: attrs, injectTo: injectTo }],
+            }];
+          }
+          return [2 /*return*/ ];
+        });
+      });
+    },
+  };
+}
+exports.multipleEntryFilePlugin = multipleEntryFilePlugin;

node_modules/vite-plugin-multiple-entries2/package.json

@@ -0,0 +1,44 @@
+{
+  "name": "vite-plugin-multiple-entries",
+  "version": "0.0.1",
+  "description": "Support multiple entries in an html file",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "engines": {
+    "node": ">=14.0.0",
+    "pnpm": ">=7.0.1"
+  },
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist",
+    "types",
+    "README.md"
+  ],
+  "devDependencies": {
+    "@types/node": "^20.11.19",
+    "typescript": "^5.3.3",
+    "rollup": "^4.12.0",
+    "vite": "^4.3.9"
+  },
+  "repository": {
+    "type": "https",
+    "url": "https://github.com/noahlam/vite-plugin-multiple-entries.git"
+  },
+  "author": "284516433@qq.com",
+  "license": "MIT",
+  "scripts": {
+    "clean": "rm -rf dist",
+    "build": "pnpm clean && tsc",
+    "prepublish": "pnpm build",
+    "dev:demo": "cd demo && vite",
+    "build:demo": "cd demo && vite build",
+    "preview:demo": "cd demo && vite preview"
+  }
+}

package-lock.json

@@ -6,6 +6,19 @@
     "": {
       "dependencies": {
         "weixin-js-sdk": "^1.6.0"
+      },
+      "devDependencies": {
+        "vite-plugin-multiple-entries2": "^0.0.1"
+      }
+    },
+    "node_modules/vite-plugin-multiple-entries2": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmmirror.com/vite-plugin-multiple-entries/-/vite-plugin-multiple-entries-0.0.1.tgz",
+      "integrity": "sha512-/RzQlc1IwBo24s+ndwGhvEJcYvR1BralQRMaWokfczhrmfpi77DTctiVu2uLHoOVp+J6SQP5882XW8Aucv+nDg==",
+      "dev": true,
+      "engines": {
+        "node": ">=14.0.0",
+        "pnpm": ">=7.0.1"
       }
     },
     "node_modules/weixin-js-sdk": {

package.json

@@ -1,5 +1,8 @@
 {
   "dependencies": {
     "weixin-js-sdk": "^1.6.0"
+  },
+  "devDependencies": {
+    "vite-plugin-multiple-entries2": "^0.0.1"
   }
 }

template.h5.html

@@ -1,30 +0,0 @@
-<!DOCTYPE html>
-<html lang="zh-CN">
-  <head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <title>
-      <%= htmlWebpackPlugin.options.title %>
-    </title>
-    <!-- Open Graph data -->
-    <!-- <meta property="og:title" content="Title Here" /> -->
-    <!-- <meta property="og:url" content="http://www.example.com/" /> -->
-    <!-- <meta property="og:image" content="http://example.com/image.jpg" /> -->
-    <!-- <meta property="og:description" content="Description Here" /> -->
-    <script>
-      var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') || CSS
-        .supports('top: constant(a)'))
-      document.write(
-        '<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
-        (coverSupport ? ', viewport-fit=cover' : '') + '" />')
-    </script>
-    <link rel="stylesheet" href="<%= BASE_URL %>static/index.<%= VUE_APP_INDEX_CSS_HASH %>.css" />
-  </head>
-  <body>
-    <noscript>
-      <strong>Please enable JavaScript to continue.</strong>
-    </noscript>
-    <div id="app"></div>
-    <!-- built files will be auto injected -->
-  </body>
-</html>

vite.config.js

@@ -1,9 +1,20 @@
-import { defineConfig } from "vite";
-import uni from "@dcloudio/vite-plugin-uni";
+import path from 'path'
+import { defineConfig } from 'vite'
+import { multipleEntryFilePlugin } from 'vite-plugin-multiple-entries2'
+import uni from '@dcloudio/vite-plugin-uni'
 
 /**
  * @type {import('vite').UserConfig}
  */
 export default defineConfig({
-  plugins: [uni()],
-});
+  plugins: [
+    uni(),
+    process.env.UNI_PLATFORM === 'h5' ? multipleEntryFilePlugin({
+      chunkName: 'config',
+      entryPath: path.resolve(__dirname, './config.js'),
+      entryFileName: 'config.js',
+      // injectTo: 'body-prepend',
+      crossorigin: true,
+    }) : undefined,
+  ]
+})