Fix wildcard imports and update dependencies (#30)

* fix: wildcard imports * chore: update dependencies and fix dependabot alert * chore: update node version used in actions
Dschungelabenteuer · Nov 1, 2023 · e0f268e · e0f268e
1 parent 50872d5
commit e0f268e
Show file tree

Hide file tree

Showing 27 changed files with 1,742 additions and 1,683 deletions.
diff --git a/.changeset/cool-years-boil.md b/.changeset/cool-years-boil.md
@@ -0,0 +1,7 @@
+---
+'vite-plugin-entry-shaking': patch
+---
+
+Fixed an issue where wildcard imports would break instead of be ignored. This led to further
+considerations about some edge cases wildcard imports could cause. See
+[this example](./examples/issue-29/src/main.ts) for further information.
diff --git a/.changeset/polite-apricots-stare.md b/.changeset/polite-apricots-stare.md
@@ -0,0 +1,5 @@
+---
+'vite-plugin-entry-shaking': patch
+---
+
+Updated dependencies and fixed dependabot alerts
diff --git a/.github/actions/install/action.yml b/.github/actions/install/action.yml
@@ -7,7 +7,7 @@ runs:
     - name: Install Node.js
       uses: actions/setup-node@v3
       with:
-        node-version: 16
+        node-version: 20
 
     - uses: pnpm/action-setup@v2
       name: Install pnpm

diff --git a/examples/complete/package.json b/examples/complete/package.json
@@ -9,9 +9,9 @@
     "preview": "vite preview"
   },
   "devDependencies": {
-    "@yungezeit/eslint-config-typescript": "^0.0.12",
-    "typescript": "^4.6.4",
-    "vite": "^4.0.5",
+    "@yungezeit/eslint-config-typescript": "^0.0.13",
+    "typescript": "^5.2.2",
+    "vite": "^4.5.0",
     "vite-plugin-entry-shaking": "workspace:*"
   }
 }
diff --git a/examples/issue-18/package.json b/examples/issue-18/package.json
@@ -9,9 +9,9 @@
     "preview": "vite preview"
   },
   "devDependencies": {
-    "@yungezeit/eslint-config-typescript": "^0.0.12",
-    "typescript": "^4.6.4",
-    "vite": "^4.0.5",
+    "@yungezeit/eslint-config-typescript": "^0.0.13",
+    "typescript": "^5.2.2",
+    "vite": "^4.5.0",
     "vite-plugin-entry-shaking": "workspace:*"
   }
 }
diff --git a/examples/issue-29/.eslintrc.json b/examples/issue-29/.eslintrc.json
@@ -0,0 +1,3 @@
+{
+  "extends": ["@yungezeit/typescript"]
+}
diff --git a/examples/issue-29/.gitignore b/examples/issue-29/.gitignore
@@ -0,0 +1,25 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dev-dist
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/examples/issue-29/index.html b/examples/issue-29/index.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1.0"
+    />
+    <title>vite-plugin-entry-shaking simple example</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script
+      type="module"
+      src="/src/main.ts"
+    ></script>
+  </body>
+</html>
diff --git a/examples/issue-29/package.json b/examples/issue-29/package.json
@@ -0,0 +1,17 @@
+{
+  "name": "vite-plugin-entry-shaking-example-issue29",
+  "type": "module",
+  "version": "0.0.0",
+  "private": true,
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "preview": "vite preview"
+  },
+  "devDependencies": {
+    "@yungezeit/eslint-config-typescript": "^0.0.13",
+    "typescript": "^5.2.2",
+    "vite": "^4.5.0",
+    "vite-plugin-entry-shaking": "workspace:*"
+  }
+}
diff --git a/examples/issue-29/src/main.ts b/examples/issue-29/src/main.ts
@@ -0,0 +1,23 @@
+import * as Utils from '@utils';
+import { C } from './utils/C';
+import initExample from '../../init';
+
+/**
+ * C is manually re-imported to illustrate potential collisions between
+ * tree-shaking its statement triggers and the effects it may have on the
+ * whole Utils state.
+ *
+ * In versions <= 0.3.2, such a scenario would result in `Utils` only exposing
+ * `A` and `B` because the served module would be the one that was proceeded
+ * (and cleaned up) in the early entry analyzis stage.
+ *
+ * Despite this being a weird practice, this could still lead to undesired
+ * and hard-to-track issues. Instead, in such scenarios, we should serve
+ * the original entry file.
+ */
+
+console.info(Utils, C);
+
+if (import.meta.hot) {
+  initExample(import.meta, 'issue 29');
+}
diff --git a/examples/issue-29/src/utils/C.ts b/examples/issue-29/src/utils/C.ts
@@ -0,0 +1 @@
+export const C = 'c';
diff --git a/examples/issue-29/src/utils/index.ts b/examples/issue-29/src/utils/index.ts
@@ -0,0 +1,3 @@
+export const A = 'a';
+export const B = 'b';
+export { C } from './C';
diff --git a/examples/issue-29/src/vite-env.d.ts b/examples/issue-29/src/vite-env.d.ts
@@ -0,0 +1 @@
+/// <reference types="vite/client" />
diff --git a/examples/issue-29/tsconfig.json b/examples/issue-29/tsconfig.json
@@ -0,0 +1,23 @@
+{
+  "compilerOptions": {
+    "target": "ESNext",
+    "useDefineForClassFields": true,
+    "module": "ESNext",
+    "lib": ["ESNext", "DOM"],
+    "moduleResolution": "Node",
+    "strict": true,
+    "sourceMap": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "esModuleInterop": true,
+    "noEmit": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noImplicitReturns": true,
+    "skipLibCheck": true,
+    "paths": {
+      "@utils": ["./src/utils"]
+    }
+  },
+  "include": ["src"]
+}
diff --git a/examples/issue-29/vite.config.ts b/examples/issue-29/vite.config.ts
@@ -0,0 +1,38 @@
+import { resolve } from 'path';
+import type { PluginOption } from 'vite';
+import { defineConfig } from 'vite';
+
+import EntryShakingPlugin from 'vite-plugin-entry-shaking';
+
+const pathToUtils = resolve(__dirname, 'src/utils');
+let requestCount = 0;
+let disabled = false;
+
+const countRequestPlugin = (): PluginOption => ({
+  name: 'vite-count-request-plugin',
+  configResolved(config) {
+    disabled = !config.plugins.find((plugin) => plugin.name === 'vite-plugin-entry-shaking');
+  },
+  configureServer(server) {
+    server.ws.on('count-request:fetch', () => {
+      server.ws.send('count-request:refresh', { requestCount, disabled });
+    });
+  },
+  load() {
+    requestCount += 1;
+  },
+});
+
+export default defineConfig(async () => ({
+  resolve: {
+    alias: {
+      '@utils': pathToUtils,
+    },
+  },
+  plugins: [
+    await EntryShakingPlugin({
+      targets: [pathToUtils],
+    }),
+    countRequestPlugin(),
+  ],
+}));
diff --git a/examples/simple/package.json b/examples/simple/package.json
@@ -9,9 +9,9 @@
     "preview": "vite preview"
   },
   "devDependencies": {
-    "@yungezeit/eslint-config-typescript": "^0.0.12",
-    "typescript": "^4.6.4",
-    "vite": "^4.0.5",
+    "@yungezeit/eslint-config-typescript": "^0.0.13",
+    "typescript": "^5.2.2",
+    "vite": "^4.5.0",
     "vite-plugin-entry-shaking": "workspace:*"
   }
 }
diff --git a/package.json b/package.json
@@ -23,11 +23,20 @@
     "changeset:version": "changeset version && pnpm install --lockfile-only"
   },
   "devDependencies": {
-    "@changesets/changelog-github": "^0.4.7",
-    "@changesets/cli": "^2.25.0",
-    "@yungezeit/eslint-config-base": "^0.0.12",
-    "eslint": "^8.46.0",
-    "eslint-config-prettier": "^8.8.0",
-    "prettier": "^2.8.8"
+    "@changesets/changelog-github": "^0.4.8",
+    "@changesets/cli": "^2.26.2",
+    "@yungezeit/eslint-config-base": "^0.0.13",
+    "eslint": "^8.52.0",
+    "eslint-config-prettier": "^9.0.0",
+    "prettier": "^3.0.3"
+  },
+  "pnpm": {
+    "packageExtensions": {
+      "vite": {
+        "dependencies": {
+          "postcss": "^8.4.31"
+        }
+      }
+    }
   }
 }
diff --git a/packages/core/package.json b/packages/core/package.json
@@ -52,19 +52,19 @@
     "vite": ">=2.0.0"
   },
   "dependencies": {
-    "es-module-lexer": "^1.0.3",
-    "magic-string": "^0.26.3"
+    "es-module-lexer": "^1.3.1",
+    "magic-string": "^0.30.5"
   },
   "devDependencies": {
-    "@types/node": "^18.7.18",
-    "@vitest/coverage-istanbul": "^0.23.4",
-    "@yungezeit/eslint-config-typescript": "^0.0.12",
-    "eslint": "^8.46.0",
-    "eslint-config-prettier": "^8.8.0",
+    "@types/node": "^20.8.10",
+    "@vitest/coverage-istanbul": "^0.34.6",
+    "@yungezeit/eslint-config-typescript": "^0.0.13",
+    "eslint": "^8.52.0",
+    "eslint-config-prettier": "^9.0.0",
     "ts-dedent": "^2.2.0",
-    "typescript": "^4.8.3",
-    "unbuild": "^0.8.11",
-    "vite": "^4.0.5",
-    "vitest": "^0.23.2"
+    "typescript": "^5.2.2",
+    "unbuild": "^2.0.0",
+    "vite": "^4.5.0",
+    "vitest": "^0.34.6"
   }
 }
diff --git a/packages/core/src/analyze-import.ts b/packages/core/src/analyze-import.ts
@@ -11,6 +11,10 @@ import type {
   TargetImports,
 } from './types';
 
+import { addSourceQuerySuffix } from './urls';
+
+const WILDCARD_IMPORT_PREFIX = 'import *';
+
 /**
  * Returns the import params of a single imported entity.
  * @param importString Import statement string.
@@ -167,7 +171,7 @@ const resolveImportedCircularEntities = async (
 };
 
 /**
- * Analyzes a single target import.
+ * Analyzes and transforms a single target import.
  * @param src MagicString instance to prepare transforms.
  * @param code Source code of the file.
  * @param entries _reference_ - Map of parsed entry files.
@@ -187,13 +191,44 @@ const analyzeImportStatement = async (
   endPosition: number,
   resolver: ResolveFn,
 ) => {
+  const isWildCardImport = catchWildcardImport(src, code, startPosition, endPosition, entryPath);
+  if (isWildCardImport) return;
+
   const namedImports = methods.getImportedNamedExports(code, startPosition, endPosition);
   const imported = await methods.getImportsMap(entryExports, entryPath, namedImports, resolver);
   const replacement = await methods.getImportReplacements(imported, entryPath, entries, resolver);
 
   src.overwrite(startPosition, endPosition + 1, `${replacement.join(';\n')};`);
 };
 
+/**
+ * Catches and handles import statement is a wildcard import.
+ * @param src MagicString instance to prepare transforms.
+ * @param code Source code of the file.
+ * @param startPosition Start position of the import statement.
+ */
+const catchWildcardImport = (
+  src: MagicString,
+  code: string,
+  startPosition: number,
+  endPosition: number,
+  entryPath: any,
+) => {
+  const isWildCardImport =
+    code.slice(startPosition, WILDCARD_IMPORT_PREFIX.length) === WILDCARD_IMPORT_PREFIX;
+
+  if (isWildCardImport) {
+    const [what] = code.slice(startPosition, endPosition).split('from');
+    src.overwrite(
+      startPosition,
+      endPosition + 1,
+      `${what.trim()} from "${addSourceQuerySuffix(entryPath)}";`,
+    );
+  }
+
+  return isWildCardImport;
+};
+
 const methods = {
   getImportParams,
   getImportedNamedExports,

diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts
@@ -4,10 +4,9 @@ import { configureLogger } from './logger';
 import { transformIfNeeded } from './transform';
 import { mergeOptions } from './options';
 import EntryAnalyzer from './analyze-entry';
+import { parseId } from './urls';
 
-export async function createEntryShakingPlugin(
-  userOptions: PluginOptions,
-): Promise<PluginOption> {
+export async function createEntryShakingPlugin(userOptions: PluginOptions): Promise<PluginOption> {
   const options = mergeOptions(userOptions);
   let logger: Logger;
   let resolver: ResolveFn;
@@ -37,9 +36,14 @@ export async function createEntryShakingPlugin(
     },
 
     load(id) {
-      if (entries.has(id)) {
-        logger.info(`Serving mutated entry file ${id}`);
-        return entries.get(id)!.updatedSource;
+      const { url, serveSource } = parseId(id);
+      const entry = entries.get(url);
+
+      if (entry) {
+        const version = serveSource ? 'original' : 'mutated';
+        const output = serveSource ? entry.source : entry.updatedSource;
+        logger.info(`Serving ${version} entry file ${url}`);
+        return output;
       }
     },
   };

diff --git a/packages/core/src/transform.ts b/packages/core/src/transform.ts
@@ -66,6 +66,7 @@ export async function transformImports(
   await init;
   const src = new MagicString(code);
 
+
   for (const { n: targetPath, ss: startPosition, se: endPosition } of imports) {
     const resolvedImport = targetPath && (await resolver(targetPath, id));
     const entry = resolvedImport && entries.get(resolvedImport);