fix: support base

example/package.json

@@ -17,6 +17,6 @@
     "cross-env": "^7.0.3",
     "http-server": "^0.12.3",
     "typescript": "^4.2.3",
-    "vite": "^2.1.0"
+    "vite": "^2.1.2"
   }
 }

example/yarn.lock

@@ -494,10 +494,10 @@ emojis-list@^3.0.0:
   resolved "https://registry.npmjs.org/emojis-list/-/emojis-list-3.0.0.tgz#5570662046ad29e2e916e71aae260abdff4f6a78"
   integrity sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==
 
-esbuild@^0.9.2:
-  version "0.9.2"
-  resolved "https://registry.npmjs.org/esbuild/-/esbuild-0.9.2.tgz#7e9fde247c913ed8ee059e2648b0c53f7d00abe5"
-  integrity sha512-xE3oOILjnmN8PSjkG3lT9NBbd1DbxNqolJ5qNyrLhDWsFef3yTp/KTQz1C/x7BYFKbtrr9foYtKA6KA1zuNAUQ==
+esbuild@^0.9.3:
+  version "0.9.4"
+  resolved "https://registry.npmjs.org/esbuild/-/esbuild-0.9.4.tgz#4480ffc4c1e5d5bb25958f889b5de0279bfb2d6f"
+  integrity sha512-bF6laCiYE5+iAfZsX+v6Lwvi5QbvKN3tThxDIR2WLyLYzTzNn0ijdpqkvTVsafmRZjic2Nq1nkSf5RSWySDTjA==
 
 escape-string-regexp@^1.0.5:
   version "1.0.5"
@@ -936,12 +936,12 @@ util-deprecate@^1.0.2:
   resolved "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
   integrity sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=
 
-vite@^2.1.0:
-  version "2.1.0"
-  resolved "https://registry.npmjs.org/vite/-/vite-2.1.0.tgz#fdaab9cca360a88b654eaf942d13be29ed0958eb"
-  integrity sha512-qWYmX8slkv91C3hWA2iu0o0ZvFbO2dSfWIN4dbMfSeMdNn+XeirkGWU3dy5/W1Nv13cQZvVoMTl8zyC13VFRZQ==
+vite@^2.1.2:
+  version "2.1.2"
+  resolved "https://registry.npmjs.org/vite/-/vite-2.1.2.tgz#0aecaf6d34112b24536df1a14cd8d74fdcab6e20"
+  integrity sha512-K96k5Nb1kywggFwZNGf/NQVZIrjMSvjebYWFIEQRu8AQWtzxatMF8/reExFXebmrfWAT3PTUk6l4zJBkpMtyVg==
   dependencies:
-    esbuild "^0.9.2"
+    esbuild "^0.9.3"
     postcss "^8.2.1"
     resolve "^1.19.0"
     rollup "^2.38.5"

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vite-plugin-svg-icons",
-  "version": "0.3.5",
+  "version": "0.4.0",
   "description": "Vite Plugin for fast creating SVG sprites.",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -59,25 +59,25 @@
     "@types/debug": "^4.1.5",
     "@types/etag": "^1.8.0",
     "@types/fs-extra": "^9.0.8",
-    "@types/jest": "^26.0.20",
+    "@types/jest": "^26.0.21",
     "@types/node": "^14.14.35",
     "@typescript-eslint/eslint-plugin": "^4.18.0",
     "@typescript-eslint/parser": "^4.18.0",
     "commitizen": "^4.2.3",
     "conventional-changelog-cli": "^2.1.1",
     "eslint": "^7.22.0",
     "eslint-config-prettier": "^8.1.0",
-    "eslint-plugin-jest": "^24.3.1",
+    "eslint-plugin-jest": "^24.3.2",
     "husky": "^5.1.3",
     "jest": "^26.6.3",
     "lint-staged": "^10.5.4",
     "pinst": "^2.1.6",
     "prettier": "^2.2.1",
     "pretty-quick": "^3.1.0",
     "rimraf": "^3.0.2",
-    "ts-jest": "^26.5.3",
-    "tsup": "^4.7.1",
+    "ts-jest": "^26.5.4",
+    "tsup": "^4.8.18",
     "typescript": "^4.2.3",
-    "vite": "^2.1.0"
+    "vite": "^2.1.2"
   }
 }

src/index.ts

@@ -43,6 +43,7 @@ interface FileStats {
 export default (opt: ViteSvgIconsPlugin): Plugin => {
   const cache = new Map<string, FileStats>();
   let isBuild = false;
+  let base: string;
 
   const options = {
     svgoOptions: true,
@@ -66,6 +67,7 @@ export default (opt: ViteSvgIconsPlugin): Plugin => {
     name: 'vite:svg-icons',
     configResolved(resolvedConfig) {
       isBuild = resolvedConfig.isProduction || resolvedConfig.command === 'build';
+      const base = resolvedConfig.base;
       debug('resolvedConfig:', resolvedConfig);
     },
     resolveId(importee) {
@@ -76,33 +78,31 @@ export default (opt: ViteSvgIconsPlugin): Plugin => {
     },
 
     async load(id) {
-      const isRegister = id === SVG_ICONS_NAME;
-      const isClient = id === SVG_ICONS_CLIENT;
-      if (isBuild && (isRegister || isClient)) {
-        const { code, idSet } = await createModuleCode(cache, svgoOptions as SvgoOptions, options);
-        if (isRegister) {
-          return code;
-        }
-        if (isClient) {
-          return idSet;
-        }
+      if (!isBuild) return null;
+      const isRegister = id.endsWith(SVG_ICONS_NAME);
+      const isClient = id.endsWith(SVG_ICONS_CLIENT);
+      const { code, idSet } = await createModuleCode(cache, svgoOptions as SvgoOptions, options);
+      if (isRegister) {
+        return code;
+      }
+      if (isClient) {
+        return idSet;
       }
-      return null;
     },
     configureServer: ({ middlewares }) => {
       middlewares.use(async (req, res, next) => {
         const url = normalizePath(req.url!);
         const registerId = `/@id/${SVG_ICONS_NAME}`;
         const clientId = `/@id/${SVG_ICONS_CLIENT}`;
-        if ([clientId, registerId].includes(url)) {
+        if ([clientId, registerId].some((item) => url.endsWith(item))) {
           res.setHeader('Content-Type', 'application/javascript');
           res.setHeader('Cache-Control', 'no-cache');
           const { code, idSet } = await createModuleCode(
             cache,
             svgoOptions as SvgoOptions,
             options
           );
-          const content = url === registerId ? code : idSet;
+          const content = url.endsWith(registerId) ? code : idSet;
 
           res.setHeader('Etag', getEtag(content, { weak: true }));
           res.statusCode = 200;