SvelteKit and TypeORM produces errors in both dev and production with minimal repository

[Glench]

I know that SvelteKit is still in beta and changing a lot, but I'd still like to ask about getting TypeORM to work with the SvelteKit dev server and production node server.

I made a minimal repository with a basic SvelteKit project (using npm init svelte@next) and TypeORM (using all the installation instructions here).

According to the TypeORM docs, my very basic repository shouldn't throw any errors, but it does. So this seems like a bug somewhere in the SvelteKit/Vite stack. Both development and production (with adapter-node) throw errors.

When I try to do npm run dev -- I get a warning that import-metadata isn't importing correctly:

reflect-metadata doesn't appear to be written in CJS, but also doesn't appear to be a valid ES module (i.e. it doesn't have "type": "module" or an .mjs extension for the entry point). Please contact the package author to fix.

Then I get an exception from TypeORM:

[vite] Error when evaluating SSR module /src/lib/User.ts:
ColumnTypeUndefinedError: Column type for User#id is not defined and cannot be guessed. Make sure you have turned on an "emitDecoratorMetadata": true option in tsconfig.json. Also make sure you have imported "reflect-metadata" on top of the main entry file in your application (before any entity imported).If you are using JavaScript instead of TypeScript you must explicitly provide a column type.

I'm not sure why the reflect-metadata library doesn't seem to be importing correctly. I've tried both import "reflect-metadata" and import * as Reflect from 'reflect-metadata'; but got the same error. Heck, I even tried copying and pasting the JS library into hooks.ts and commenting out the imports, but the same reflect-metadata and TypeORM errors seem to happen.

Right now my assumption is that if the reflect-metadata library can be imported correctly then that would fix the TypeORM error, but I'm not sure. Here's a relevant issue in the SvelteKit Github. I'm hoping that my issue can be solved without opening a new SvelteKit issue but I want to make sure that it's possible to use TypeORM with SvelteKit since it's the most starred JS ORM on Github.

Update 3: After putting reflect-metadata into the SSR external config for vite, the warning goes away but TypeORM still doesn't work. Same errors as listed in dev.

Also, when running npm run build with adapter-node, this error happens:

import { PrimaryGeneratedColumn, Column, Entity, BaseEntity } from "typeorm";
                                                 ^^^^^^^^^^
SyntaxError: Named export 'BaseEntity' not found. The requested module 'typeorm' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from 'typeorm';
const { PrimaryGeneratedColumn, Column, Entity, BaseEntity } = pkg;

    at ModuleJob._instantiate (node:internal/modules/esm/module_job:124:21)
    at async ModuleJob.run (node:internal/modules/esm/module_job:181:5)
    at async Promise.all (index 0)
    at async ESMLoader.import (node:internal/modules/esm/loader:281:24)
    at async prerender (file:///Users/glen/tmp/sveltekit-typeorm-test/node_modules/@sveltejs/kit/dist/chunks/index5.js:352:28)
    at async Object.prerender (file:///Users/glen/tmp/sveltekit-typeorm-test/node_modules/@sveltejs/kit/dist/chunks/index5.js:728:24)
    at async adapt (file:///Users/glen/tmp/sveltekit-typeorm-test/node_modules/@sveltejs/adapter-node/index.js:39:4)
    at async adapt (file:///Users/glen/tmp/sveltekit-typeorm-test/node_modules/@sveltejs/kit/dist/chunks/index5.js:760:2)
    at async file:///Users/glen/tmp/sveltekit-typeorm-test/node_modules/@sveltejs/kit/dist/cli.js:1053:5

Node.js v17.0.1

BaseEntity is obviously part of the TypeORM library so it's not clear to me what's going on.

If you have any ideas or solutions I'd love to hear them!

Update: @hyunbinseo below found that adding the database type to the Column constructor (e.g. @Column('text')) removes the ColumnTypeUndefinedError. That's a good workaround for now, but doesn't solve the issue that it should work without it, and that it doesn't work when running npm run build with adapter-node.

Update 2: @benmccann suggested using Vite's SSR/external option and that fixed the dev server warnings and errors completely! However, the issue with npm run build still exists.

Update 3: @benmccann's suggestion didn't work after all. I had just tested it wrong. Both npm run dev and npm run build are still broken with the errors shown above.

[Glench]

Wanted to refresh this issue because it seems important to support the most-starred JS ORM on Github with SvelteKit. I'll be opening an issue if no one has any ideas.

[hyunbinseo]

Please address issues in your reproduction repository before opening an issue. Reference #3334 (comment).

[gamelaster]

@Glench thank you for bringing up this issue, basically this is only reason I can't use SvelteKit 😞

[hyunbinseo]

The provided reproduction repository should first be updated to fix the following issues.

---

There is a top-level await in src/hooks.js, which shows the following error.

Top-level 'await' expressions are only allowed when the 'module' option is set to 'es2022', 'esnext', 'system', or 'nodenext', and the 'target' option is set to 'es2017' or higher.ts(1378)

---

hooks.js file is not following the required format. Reference documentation.

[Glench]

Fixed the await thing, but hooks doesn't need to have any functions exported. Also you missed where I included "emitDecoratorMetadata" right at the top of tsconfig.json. Look again. I also just npm updated so it's the latest version of everything. Try again.

[hyunbinseo]

My bad. Updated the comment regarding tsconfig.json and package-lock.json.

[hyunbinseo]

Please check the following PR - Glench/sveltekit-typeorm-test#1.

Regarding the following error, reference Why can't reflect-metadata be used in vite.

reflect-metadata doesn't appear to be written in CJS, but also doesn't appear to be a valid ES module (i.e. it doesn't have "type": "module" or an .mjs extension for the entry point). Please contact the package author to fix.

Vite uses ESBuild which doesn't support "emitDecoratorMetadata" in tsconfig, since ESBuild doesn't have its own type system implemented. Refer to this vitejs/vite#788 for more details on this topic.

[Glench]

If you look at #798 you can see this comment:

esbuild has been removed from adapter-node, so this should work there now. It's still present in adapter-vercel, which is what this issue was originally filed about. I'm not sure why it's still there. Possibly it could be removed with a bit of work. It might be mentioned in one of the resolved reviews on #2931

• Type reflection issues #798 (comment)

[Glench]

So yes, adding the "type" to the Column constructor (e.g. @Column('text')) does seem to fix the errors in development, which is the major change you introduced in your PR. So that's a great step forward! Thanks!

But two issues remain:

1. According to the TypeORM docs, I shouldn't need to provide the column type. It should be inferred automatically. So my current repository should still work fine.
2. npm run build still produces an error with adapter-node.

[hyunbinseo]

Why not edit the discussion and add the above two issues that you faced?

This way, the community members can actually understand what your issues are.

In fact, it should have been added in the first place, especially the issue no. 1.

All you have mentioned in the discussion is the following exception from TypeORM.

[vite] Error when evaluating SSR module /src/lib/User.ts:
ColumnTypeUndefinedError: Column type for User#id is not defined and cannot be guessed. Make sure you have turned on an "emitDecoratorMetadata": true option in tsconfig.json. Also make sure you have imported "reflect-metadata" on top of the main entry file in your application (before any entity imported).If you are using JavaScript instead of TypeScript you must explicitly provide a column type.

[Glench]

Good idea!

[Glench]

Done, made the title reflect the actual issues and mentioned your workaround. I think this is entering reportable bug territory.

[benmccann]

reflect-metadata doesn't appear to be written in CJS, but also doesn't appear to be a valid ES module (i.e. it doesn't have "type": "module" or an .mjs extension for the entry point). Please contact the package author to fix.

That comes from this line:
https://github.com/vitejs/vite/blob/a4895ed9d71531c71243ffcb3aab465ecd5694a0/packages/vite/src/node/ssr/ssrExternal.ts#L170

You can see that it checks if it's CJS with:

const CJS_CONTENT_RE =
  /\bmodule\.exports\b|\bexports[.\[]|\brequire\s*\(|\bObject\.(defineProperty|defineProperties|assign)\s*\(\s*exports\b/

reflect-metadata's Reflect.js does not have module, exports, or require in it, which is why it's not being detected as CommonJS

You could manually add it to Vite's ssr.external since it can't be autodetected as CJS

[benmccann]

I think with build it will depend on the deployment platform. The adapters using esbuild will need extra work (i.e. Cloudflare and Vercel if my memory is correct) and will need to investigate the solutions above or in other threads. If you used an adapter without esbuild (e.g. adapter-node or adapter-netlify I believe) then you'll likely face fewer struggles

[Glench]

Hm ok, thanks for the clarification. I'm actually using adapter-node though :/

[Glench]

Wait actually I tried again and your solution with SSR external didn't actually work. Dev is still broken. I had old code in my repo.

[lkj4]

@Glench did you get it working? I tried following and still get the error in production builds:

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

 export default {
   preprocess: preprocess(),
   kit: {
     adapter: adapter({ out: 'my-output-directory' }),
   },
   vite: {
     ssr: {
       external: ['reflect-metadata'],
     },
   },
 }

[benmccann]

I've sent vitejs/vite#8033 to fix this. It would probably be a Vite 3 improvement though so you might have to wait a couple months

[mustofa-id]

Specify column type as mention above and using default import seem work well for me in dev and build. Here example.

[Glench]

This uses the data mapper pattern but doesn't allow the ActiveRecord pattern as far as I know.

[MusiCode1]

Will there be full support for TypeORM for version 1.0.0?

[benmccann]

Is it not working today? If not, please provide a repository that reproduces the issue

[TongChia]

still problem with esbuild
but turn it off works

vite.config.ts

import typescript from "@rollup/plugin-typescript";
import { sveltekit } from '@sveltejs/kit/vite';
import type { UserConfig } from 'vite';

const config: UserConfig = {
	plugins: [sveltekit(), typescript()],
	test: {
		include: ['src/**/*.{test,spec}.{js,ts}']
	},
	ssr: {
		external: ["reflect-metadata"]
	},
	esbuild: false
};

export default config;