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

cannot use createRequire with adapter-node #2566

Closed
andykais opened this issue Oct 6, 2021 · 11 comments
Closed

cannot use createRequire with adapter-node #2566

andykais opened this issue Oct 6, 2021 · 11 comments

Comments

@andykais
Copy link

andykais commented Oct 6, 2021

Describe the bug

the builtin method createRequire works fine in development, but fails when building a production app with adapter-node.

Reproduction

any esm file with a require statement like the following will fail to build/preview.

// src/hooks.ts
import { createRequire } from 'module'
const require = createRequire(import.meta.url)
const myLibrary = require('some-commonjs-library')

I have the default svelte.config.js with an adapter-node added.

import preprocess from 'svelte-preprocess'
import adapter from '@sveltejs/adapter-node'

/** @type {import('@sveltejs/kit').Config} */
const config = {
  // Consult https://github.com/sveltejs/svelte-preprocess
  // for more information about preprocessors
  preprocess: preprocess(),

  kit: {
    // hydrate the <div id="svelte"> element in src/app.html
    target: '#svelte',
    files: {
      hooks: 'src/hooks',
    },
    adapter: adapter({
      out: 'build',
    })
  },
}

export default config

running npm run build will error out.

Logs

here is the output of `npm run build`

> ~TODO~@0.0.1 build
> svelte-kit build

vite v2.6.3 building for production...
transforming (9) .svelte-kit/build/runtime/paths.js4:53:35 PM [vite-plugin-svelte] /Users/andrew/Code/scratchwork/forager-web/src/components/media_reference.svelte:15:11 Media_reference has unused export property 'loading'. If it is for external reference only, please consider using `export const loading`
13: import TagSearch from './search/tags-ss.svelte';
14: import { focus } from '../stores/focus';
15: export let loading = false;
               ^
16: export let tags = [];
17: export let media_reference;
4:53:35 PM [vite-plugin-svelte] /Users/andrew/Code/scratchwork/forager-web/src/components/media_reference.svelte:186:2 Unused CSS selector "#new-tags > div"
184:     padding: 0 2px;
185:   }
186:   #new-tags > div {
       ^
187:     background-color: red;
188:     width: 100%;
✓ 300 modules transformed.
.svelte-kit/output/client/_app/manifest.json                            1.27 KiB
.svelte-kit/output/client/_app/layout.svelte-1d0681d7.js                0.53 KiB / gzip: 0.35 KiB
.svelte-kit/output/client/_app/error.svelte-d9f5f671.js                 1.56 KiB / gzip: 0.74 KiB
.svelte-kit/output/client/_app/assets/start-61d1577b.css                0.16 KiB / gzip: 0.15 KiB
.svelte-kit/output/client/_app/assets/pages/index.svelte-5315c8be.css   4.05 KiB / gzip: 1.14 KiB
.svelte-kit/output/client/_app/start-674c995a.js                        18.12 KiB / gzip: 6.70 KiB
.svelte-kit/output/client/_app/chunks/vendor-bcb51b1f.js                20.77 KiB / gzip: 7.74 KiB
.svelte-kit/output/client/_app/pages/index.svelte-90438644.js           40.33 KiB / gzip: 13.97 KiB
vite v2.6.3 building SSR bundle for production...
transforming (9) node_modules/.pnpm/svelte@3.42.5/node_modules/svelte/internal/index.mjs4:53:36 PM [vite-plugin-svelte] /Users/andrew/Code/scratchwork/forager-web/src/components/media_reference.svelte:15:11 Media_reference has unused export property 'loading'. If it is for external reference only, please consider using `export const loading`
13: import TagSearch from './search/tags-ss.svelte';
14: import { focus } from '../stores/focus';
15: export let loading = false;
               ^
16: export let tags = [];
17: export let media_reference;
4:53:36 PM [vite-plugin-svelte] /Users/andrew/Code/scratchwork/forager-web/src/components/media_reference.svelte:186:2 Unused CSS selector "#new-tags > div"
184:     padding: 0 2px;
185:   }
186:   #new-tags > div {
       ^
187:     background-color: red;
188:     width: 100%;
✓ 43 modules transformed.
.svelte-kit/output/server/app.js   146.94 KiB

Run npm run preview to preview your production build locally.

> Using @sveltejs/adapter-node
> The argument 'filename' must be a file URL object, file URL string, or absolute path string. Received undefined
TypeError [ERR_INVALID_ARG_VALUE]: The argument 'filename' must be a file URL object, file URL string, or absolute path string. Received undefined
    at new NodeError (node:internal/errors:371:5)
    at createRequire (node:internal/modules/cjs/loader:1218:11)
    at file:///Users/andrew/Code/scratchwork/forager-web/.svelte-kit/output/server/app.js:1522:18
    at ModuleJob.run (node:internal/modules/esm/module_job:183:25)
    at async Loader.import (node:internal/modules/esm/loader:178:24)
    at async prerender (file:///Users/andrew/Code/scratchwork/forager-web/node_modules/.pnpm/@sveltejs+kit@1.0.0-next.180_svelte@3.42.5/node_modules/@sveltejs/kit/dist/chunks/index4.js:121:14)
    at async Object.prerender (file:///Users/andrew/Code/scratchwork/forager-web/node_modules/.pnpm/@sveltejs+kit@1.0.0-next.180_svelte@3.42.5/node_modules/@sveltejs/kit/dist/chunks/index4.js:353:4)
    at async adapt (file:///Users/andrew/Code/scratchwork/forager-web/node_modules/.pnpm/@sveltejs+adapter-node@1.0.0-next.53/node_modules/@sveltejs/adapter-node/index.js:111:4)
    at async adapt (file:///Users/andrew/Code/scratchwork/forager-web/node_modules/.pnpm/@sveltejs+kit@1.0.0-next.180_svelte@3.42.5/node_modules/@sveltejs/kit/dist/chunks/index4.js:378:2)
    at async file:///Users/andrew/Code/scratchwork/forager-web/node_modules/.pnpm/@sveltejs+kit@1.0.0-next.180_svelte@3.42.5/node_modules/@sveltejs/kit/dist/cli.js:878:5


### System Info

```shell
System:
    OS: macOS 11.5.1
    CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
    Memory: 380.26 MB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 16.9.1 - /usr/local/bin/node
    Yarn: 1.17.3 - /usr/local/bin/yarn
    npm: 7.23.0 - ~/.npm-packages/bin/npm
    Watchman: 2021.08.02.00 - /usr/local/bin/watchman
  Browsers:
    Chrome: 94.0.4606.71
    Firefox: 86.0.1
    Safari: 14.1.2
  npmPackages:
    @sveltejs/adapter-node: ^1.0.0-next.53 => 1.0.0-next.53
    @sveltejs/kit: ^1.0.0-next.180 => 1.0.0-next.180
    svelte: ^3.42.5 => 3.42.5


### Severity

serious, but I can work around it

### Additional Information

I _think_ this bug will prevent anyone from using a commonjs module on the backend of a node adapter
@JeanJPNM
Copy link
Contributor

JeanJPNM commented Oct 6, 2021

Why not just write:

import * as myLibrary from "some-commonjs-library"

@Mlocik97
Copy link
Contributor

Mlocik97 commented Oct 7, 2021

@JeanJPNM this doesn't work always,... or better said, this work only sometimes. I think, createRequire should work.

@JeanJPNM
Copy link
Contributor

JeanJPNM commented Oct 7, 2021

Why wouldn't it work? As far as I know you can import commonjs modules inside esm ones.

@JeanJPNM
Copy link
Contributor

JeanJPNM commented Oct 7, 2021

Also, in the built app you don't actually use import.meta.url, import.meta gets compiled as an empty object local to the module, so import.meta.url gets compiled into import_meta.url which is undefined. And that's why createRequire doesn't work

@Mlocik97
Copy link
Contributor

Mlocik97 commented Oct 7, 2021

Why wouldn't it work? As far as I know you can import commonjs modules inside esm ones.

depends how it's exported, on configuration of package, and if it depend on another esm or commonjs package,... and it really doesn't work in all situations.

That's why createRequire exist in first place.

@Conduitry Conduitry added vite and removed vite labels Oct 7, 2021
@Conduitry
Copy link
Member

Poking around about this transformation, I found evanw/esbuild#208 - I wonder whether having the target format in SvelteKit's configuration that it sends to Vite hardcoded to es2018 is resulting in this still happening?

@andykais
Copy link
Author

andykais commented Oct 7, 2021

fwiw, I cannot use import with this commonjs module. It is being linked locally as an npm package, but that should not matter

11:47:38 AM [vite] Error when evaluating SSR module /@fs/Users/andrew/Code/scratchwork/forager/build/src/index.js:
ReferenceError: exports is not defined
    at eval (/@fs/Users/andrew/Code/scratchwork/forager/build/src/index.js:14:23)
    at instantiateModule (/Users/andrew/Code/scratchwork/forager-web/node_modules/.pnpm/vite@2.6.3/node_modules/vite/dist/node/chunks/dep-f5e099f1.js:66443:15)

@bluwy
Copy link
Member

bluwy commented Oct 7, 2021

@andykais Linking an npm package locally matters. Vite treats them as source code (code that you write), and would expect that npm package to be exported with ESM code. If it's not possible, the way around it is to explicitly add that library to optimizeDeps,include, but you have to make sure to re-optimize your app whenever you update the npm package,

@andykais
Copy link
Author

andykais commented Oct 7, 2021

Linking an npm package locally matters

I dont think thats true, or maybe Im not using the right terminology. I am linking this package via pnpm link -g my-packaage which symlinks it into node_modules like any other module. I am importing it like any other node module as well. (import * as myPackage from 'my-package

@bluwy
Copy link
Member

bluwy commented Oct 7, 2021

@andykais Vite has special handling for linked dependencies.

@Rich-Harris
Copy link
Member

Pretty sure #2566 (comment) is correct — this works in the current version, but fails if I override config.kit.vite.build.target to be es2018

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

6 participants