Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Version 3.0.6 isn't compatible with Vite 5.3.5 #177

Open
thecannabisapp opened this issue Aug 5, 2024 · 0 comments
Open

Version 3.0.6 isn't compatible with Vite 5.3.5 #177

thecannabisapp opened this issue Aug 5, 2024 · 0 comments

Comments

@thecannabisapp
Copy link

thecannabisapp commented Aug 5, 2024

Describe the bug
Trying to migrate my project from webpack 5 to vite 5 using vite-plugin-wasm but getting Could not resolve "a" when in dev mode and Rollup failed to resolve import "a" when running build.

To Reproduce

Here's a sandbox minimal reproduction: https://stackblitz.com/edit/vitejs-vite-jruc2f

Steps to reproduce the behavior:

  1. Run yarn create vite vite-react-app --template react-ts to create a fresh vite project using react and typscript template
  2. Add yarn add @virgilsecurity/e3kit-browser and yarn add -D vite-plugin-wasm to the project.
  3. Edit App.tsx by adding the following code to import e3kit and initialise EThree.
import { EThree } from "@virgilsecurity/e3kit-browser";

function App() {
  const initializeEThree = async () => {
    const e = await EThree.initialize(() => Promise.resolve(""));
    console.log(e);
  };
  initializeEThree();

  return <></>;
}

export default App;
  1. Edit vite-config.ts with
import react from "@vitejs/plugin-react";
import { defineConfig } from "vite";
import wasm from "vite-plugin-wasm";

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react(), wasm()],
});
  1. Run yarn dev or yarn build
  2. See error for yarn build
yarn build                                                                                                                             2m 22s  20.9.0
yarn run v1.22.22
$ tsc -b && vite build --debug
  vite:config bundled config file loaded in 24.77ms +0ms
  vite:config using resolved config: {
  vite:config   plugins: [
  vite:config     'vite:build-metadata',
  vite:config     'vite:watch-package-data',
  vite:config     'vite:pre-alias',
  vite:config     'alias',
  vite:config     'vite:react-babel',
  vite:config     'vite:react-refresh',
  vite:config     'vite-plugin-wasm',
  vite:config     'vite:modulepreload-polyfill',
  vite:config     'vite:resolve',
  vite:config     'vite:html-inline-proxy',
  vite:config     'vite:css',
  vite:config     'vite:esbuild',
  vite:config     'vite:json',
  vite:config     'vite:wasm-helper',
  vite:config     'vite:worker',
  vite:config     'vite:asset',
  vite:config     'vite:wasm-fallback',
  vite:config     'vite:define',
  vite:config     'vite:css-post',
  vite:config     'vite:build-html',
  vite:config     'vite:worker-import-meta-url',
  vite:config     'vite:asset-import-meta-url',
  vite:config     'vite:force-systemjs-wrap-complete',
  vite:config     'commonjs',
  vite:config     'vite:data-uri',
  vite:config     'vite:dynamic-import-vars',
  vite:config     'vite:import-glob',
  vite:config     'vite:build-import-analysis',
  vite:config     'vite:esbuild-transpile',
  vite:config     'vite:terser',
  vite:config     'vite:reporter',
  vite:config     'vite:load-fallback'
  vite:config   ],
  vite:config   build: {
  vite:config     target: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ],
  vite:config     cssTarget: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ],
  vite:config     outDir: 'dist',
  vite:config     assetsDir: 'assets',
  vite:config     assetsInlineLimit: 4096,
  vite:config     cssCodeSplit: true,
  vite:config     sourcemap: false,
  vite:config     rollupOptions: { onwarn: [Function: onwarn] },
  vite:config     minify: 'esbuild',
  vite:config     terserOptions: {},
  vite:config     write: true,
  vite:config     emptyOutDir: null,
  vite:config     copyPublicDir: true,
  vite:config     manifest: false,
  vite:config     lib: false,
  vite:config     ssr: false,
  vite:config     ssrManifest: false,
  vite:config     ssrEmitAssets: false,
  vite:config     reportCompressedSize: true,
  vite:config     chunkSizeWarningLimit: 500,
  vite:config     watch: null,
  vite:config     commonjsOptions: { include: [Array], extensions: [Array] },
  vite:config     dynamicImportVarsOptions: { warnOnError: true, exclude: [Array] },
  vite:config     modulePreload: { polyfill: true },
  vite:config     cssMinify: true
  vite:config   },
  vite:config   esbuild: { jsxDev: false, jsx: 'automatic', jsxImportSource: undefined },
  vite:config   optimizeDeps: {
  vite:config     holdUntilCrawlEnd: true,
  vite:config     esbuildOptions: {
  vite:config       preserveSymlinks: false,
  vite:config       jsx: 'automatic',
  vite:config       plugins: [Array],
  vite:config       target: 'esnext'
  vite:config     },
  vite:config     include: [ 'react', 'react/jsx-dev-runtime', 'react/jsx-runtime' ]
  vite:config   },
  vite:config   resolve: {
  vite:config     mainFields: [ 'browser', 'module', 'jsnext:main', 'jsnext' ],
  vite:config     conditions: [],
  vite:config     extensions: [
  vite:config       '.mjs',  '.js',
  vite:config       '.mts',  '.ts',
  vite:config       '.jsx',  '.tsx',
  vite:config       '.json'
  vite:config     ],
  vite:config     dedupe: [ 'react', 'react-dom' ],
  vite:config     preserveSymlinks: false,
  vite:config     alias: [ [Object], [Object] ]
  vite:config   },
  vite:config   configFile: '/Users/Dev/vite-react-app/vite.config.ts',
  vite:config   configFileDependencies: [ '/Users/Dev/vite-react-app/vite.config.ts' ],
  vite:config   inlineConfig: {
  vite:config     root: undefined,
  vite:config     base: undefined,
  vite:config     mode: undefined,
  vite:config     configFile: undefined,
  vite:config     logLevel: undefined,
  vite:config     clearScreen: undefined,
  vite:config     build: {}
  vite:config   },
  vite:config   root: '/Users/Dev/vite-react-app',
  vite:config   base: '/',
  vite:config   rawBase: '/',
  vite:config   publicDir: '/Users/Dev/vite-react-app/public',
  vite:config   cacheDir: '/Users/Dev/vite-react-app/node_modules/.vite',
  vite:config   command: 'build',
  vite:config   mode: 'production',
  vite:config   ssr: {
  vite:config     target: 'node',
  vite:config     optimizeDeps: { noDiscovery: true, esbuildOptions: [Object] }
  vite:config   },
  vite:config   isWorker: false,
  vite:config   mainConfig: null,
  vite:config   bundleChain: [],
  vite:config   isProduction: true,
  vite:config   css: { lightningcss: undefined },
  vite:config   server: {
  vite:config     preTransformRequests: true,
  vite:config     sourcemapIgnoreList: [Function: isInNodeModules$1],
  vite:config     middlewareMode: false,
  vite:config     fs: {
  vite:config       strict: true,
  vite:config       allow: [Array],
  vite:config       deny: [Array],
  vite:config       cachedChecks: undefined
  vite:config     }
  vite:config   },
  vite:config   preview: {
  vite:config     port: undefined,
  vite:config     strictPort: undefined,
  vite:config     host: undefined,
  vite:config     https: undefined,
  vite:config     open: undefined,
  vite:config     proxy: undefined,
  vite:config     cors: undefined,
  vite:config     headers: undefined
  vite:config   },
  vite:config   envDir: '/Users/Dev/vite-react-app',
  vite:config   env: { BASE_URL: '/', MODE: 'production', DEV: false, PROD: true },
  vite:config   assetsInclude: [Function: assetsInclude],
  vite:config   logger: {
  vite:config     hasWarned: false,
  vite:config     info: [Function: info],
  vite:config     warn: [Function: warn],
  vite:config     warnOnce: [Function: warnOnce],
  vite:config     error: [Function: error],
  vite:config     clearScreen: [Function: clearScreen],
  vite:config     hasErrorLogged: [Function: hasErrorLogged]
  vite:config   },
  vite:config   packageCache: Map(1) {
  vite:config     'fnpd_/Users/Dev/vite-react-app' => {
  vite:config       dir: '/Users/Dev/vite-react-app',
  vite:config       data: [Object],
  vite:config       hasSideEffects: [Function: hasSideEffects],
  vite:config       webResolvedImports: {},
  vite:config       nodeResolvedImports: {},
  vite:config       setResolvedCache: [Function: setResolvedCache],
  vite:config       getResolvedCache: [Function: getResolvedCache]
  vite:config     },
  vite:config     set: [Function (anonymous)]
  vite:config   },
  vite:config   createResolver: [Function: createResolver],
  vite:config   worker: { format: 'iife', plugins: '() => plugins', rollupOptions: {} },
  vite:config   appType: 'spa',
  vite:config   experimental: { importGlobRestoreExtension: false, hmrPartialAccept: false },
  vite:config   getSortedPlugins: [Function: getSortedPlugins],
  vite:config   getSortedPluginHooks: [Function: getSortedPluginHooks]
  vite:config } +24ms
vite v5.3.5 building for production...
✓ 20 modules transformed.
x Build failed in 259ms
error during build:
[vite]: Rollup failed to resolve import "a" from "/Users/Dev/vite-react-app/node_modules/@virgilsecurity/e3kit-browser/dist/libpythia.browser.wasm".
This is most likely unintended because it can break your application at runtime.
If you do want to externalize this module explicitly add it to
`build.rollupOptions.external`
    at viteWarn (file:///Users/Dev/vite-react-app/node_modules/vite/dist/node/chunks/dep-mCdpKltl.js:65265:17)
    at onwarn (file:///Users/Dev/vite-react-app/node_modules/@vitejs/plugin-react/dist/index.mjs:266:9)
    at onRollupWarning (file:///Users/Dev/vite-react-app/node_modules/vite/dist/node/chunks/dep-mCdpKltl.js:65295:5)
    at onwarn (file:///Users/Dev/vite-react-app/node_modules/vite/dist/node/chunks/dep-mCdpKltl.js:64960:7)
    at file:///Users/Dev/vite-react-app/node_modules/rollup/dist/es/shared/node-entry.js:18625:13
    at Object.logger [as onLog] (file:///Users/Dev/vite-react-app/node_modules/rollup/dist/es/shared/node-entry.js:20280:9)
    at ModuleLoader.handleInvalidResolvedId (file:///Users/Dev/vite-react-app/node_modules/rollup/dist/es/shared/node-entry.js:19215:26)
    at file:///Users/Dev/vite-react-app/node_modules/rollup/dist/es/shared/node-entry.js:19173:26
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Error for yarn dev

  VITE v5.3.5  ready in 159 ms

  ➜  Local:   http://localhost:5173/
  ➜  Network: use --host to expose
  ➜  press h + enter to show help
✘ [ERROR] Could not resolve "a"

    vite-plugin-wasm-namespace:/Users/Dev/vite-react-app/node_modules/@virgilsecurity/e3kit-browser/dist/libpythia.browser.wasm:43:935:
      43 │ ..._0_26, B as __vite__wasmImport_0_27, C as __vite__wasmImport_0_28, D as __vite__wasmImport_0_29, E as __vite__wasmImport_0_30 } from "a";
         ╵                                                                                                                                         ~~~

  You can mark the path "a" as external to exclude it from the bundle, which will remove this error
  and leave the unresolved path in the bundle.

✘ [ERROR] Could not resolve "a"

    vite-plugin-wasm-namespace:/Users/Dev/vite-react-app/node_modules/@virgilsecurity/e3kit-browser/dist/libfoundation.browser.wasm:43:455:
      43 │ ..._0_10, l as __vite__wasmImport_0_11, m as __vite__wasmImport_0_12, n as __vite__wasmImport_0_13, o as __vite__wasmImport_0_14 } from "a";
         ╵                                                                                                                                         ~~~

  You can mark the path "a" as external to exclude it from the bundle, which will remove this error
  and leave the unresolved path in the bundle.

Expected behavior
No errors and the EThree client initialising.

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

  • OS: MacOS 14
  • Browser Chrome 124
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant