Ability to build CLI in svelte-kit package despite "type":"module"

[jtlapp]

Describe the problem

I have not been able to find a way to build standalone CLI executables from .ts in svelte-kit due to the "type":"module" assignment in package.json. No custom tsconfig.tools.json seems to do the job, and folks on discord (Svelte or TypeScript) and SO don't seem to know how to help.

My app requires a separate tool for adding the admin user to the database (can't be done in SQL), and it requires a separate tool, run as a daemon, for periodically downloading data into the database.

The svelte-kit site and both tools need access to a significant amount of the same .ts code.

In order for me to make further progress, it seems that because I decided to go with svelte-kit, I'm having to split out code needed in CLIs to a separate repo. (I also have a vanilla Svelte app for Electron which doesn't have this problem.)

But I'd rather keep everything in the same repo. If this is actually possible to do in svelte-kit, it would be nice to see it documented. If it's not currently possible, it would be nice if it were possible.

Describe the proposed solution

I have no idea how to do this.

UPDATE: I have found a flexible way to accomplish this and wrote a 4-part series on the topic: https://javascript.plainenglish.io/sharing-typescript-with-nx-and-turborepo-part-1-introduction-to-monorepos-d8d54b805e46

Alternatives considered

No response

Importance

would make my life easier

Additional Information

No response

[dominikg]

this is neither a bug nor a feature request so i am going to convert it to a discussion.

[jtlapp]

Oh, sorry about that. I have never before seen a repo use "discussions," so it never entered my mind.

[dominikg]

"type": "module" in the package.json generated by svelte-kit package does not prevent you from adding a cli script to your package.

1. create the file src/lib/bin/cli.ts

#!/usr/bin/env node
console.log("Hello CLI")

2. add "bin":"/bin/cli.js" to package.json
3. run svelte-kit package and cd into package

• /package/bin/cli.js exists
• package.json contains the bin field

4. run npm pack inside package (this creates your-package-a.b.c.tgz)

• /bin/cli.js gets added to the package

5. run npx --package your-package-a.b.c.tgz your-package

• Hello CLI should be logged

Using esm ("type":"module") is perfectly fine for cli, in fact create-svelte and a lot of other cli's are built with it.

If for whatever reason you absolutely need to use cjs - disclaimer: i do not recommend it.

6. add /src/lib/bin/package.json

{"type":"commonjs"}

now cli.js will be treated as commonjs (require instead of import) after you repackaged it

[jtlapp]

I spent a day attempting to create a monorepo with separate packages that I could integrate, as you suggested in your last comment, but the problems are non-stop. I'm currently facing these:

Sourcemap for "/Users/joe/repos/cavesite-new/packages/frontend/src/common/VariableFlash.svelte" points to missing source files
Sourcemap for "/Users/joe/repos/cavesite-new/packages/frontend/src/components/HeaderBar.svelte" points to missing source files
Sourcemap for "/Users/joe/repos/cavesite-new/packages/frontend/src/common/Notice.svelte" points to missing source files
Sourcemap for "/Users/joe/repos/cavesite-new/packages/frontend/src/dialogs/LoginDialog.svelte" points to missing source files
Sourcemap for "/Users/joe/repos/cavesite-new/packages/frontend/src/components/RouteTab.svelte" points to missing source files

Vite Error, /node_modules/.vite/deps/pg.js?v=d920a1d2 optimized info should be defined
Vite Error, /node_modules/.vite/deps/@zxcvbn-ts_core.js?v=6d6e8c1c optimized info should be defined
Vite Error, /node_modules/.vite/deps/@zxcvbn-ts_language-common.js?v=eec3bdcc optimized info should be defined
Vite Error, /node_modules/.vite/deps/@zxcvbn-ts_language-en.js?v=2b05da70 optimized info should be defined

✘ [ERROR] Could not resolve "pg-native"

    ../../node_modules/.pnpm/[email protected]/node_modules/pg/lib/native/client.js:4:21:
      4 │ var Native = require('pg-native')
        ╵                      ~~~~~~~~~~~

  You can mark the path "pg-native" as external to exclude it from the bundle, which will remove
  this error. You can also surround this "require" call with a try/catch block to handle this
  failure at run-time instead of bundle-time.

I'll next ditch this effort and attempt your original solution. The pains of using a beta framework...

[jtlapp]

I'm getting tired of fighting svelte-kit. (It also took me a day to figure out non-web unit testing.) I don't need SSR. Maybe I should just use vanilla svelte. That would also protect the app from non-backward-compatible changes to svelte-kit as it evolves.

[mdujava]

Hey

svelte-kit package

no longer exists. Is there other way to accomplish this in new versions?

[jtlapp]

I've completely solved the problem and have written a four-part article explaining how to share TypeScript in a monorepo, which I'm getting ready to publish on JavaScript in Plain English. It might be another week before I get it out, but it'll be available on my medium page as well as on the publisher's site. Follow to get notified.

[ghostdevv]

@mdujava You use @sveltejs/package now - https://kit.svelte.dev/docs/packaging

[mihaon]

But what about CLI scripts for a build version of the site (created via npm run build)? Often production sites require the CLI scripts. For example, something like:

bin/deleteOldUsers.js

import { SOME_ENV_VAR } from '$env/static/private'
// ... some code uses SOME_ENV_VAR ...

Is there any solution for this in SvelteKit?

[jtlapp]

I couldn't figure out how to build CLIs in my SvelteKit repo, couldn't figure out how to run jest against backend code, couldn't figure out how to share backend and frontend code that had to use different tsconfigs, and couldn't get a monorepo working with SvelteKit to let me do these things either. As a result, we did not use SvelteKit. That was with a version 6 months ago, so I don't know where things stand now.

[edbrdi]

I had the same problem and found a trick: adding an empty package.json to the CLI's outDir.

In your package.json:

"build:cli": "rm -rf ./dist && npx tsc -p ./src/cli && chmod +x ./dist/index.js && touch ./dist/package.json && echo '{}' > ./dist/package.json",

[ghostdevv]

What does this solve?

[edbrdi]

Ability to build CLI in svelte-kit package despite "type":"module"

[jtlapp]

I tried this. In my case, it moves the error from build time to runtime in the browser, which complains that exports aren't found.

It is interesting that this has any effect at all.

[jtlapp]

However, I have found a combination of tweaks, including this tweak, that allows CJS workspaces to import from "type": "module" workspaces that also generate CJS. The Vite/Svelte ecosystem seems to require that any workspace it imports be "type": "module". But this way, the CLI and Svelte can both import from the same workspaces. I'll document the approach and include it in my Medium.com publication, which should then be ready to go.

[jtlapp]

I spent about 6 months this year on-and-off exploring this problem, collecting my notes, and writing a series of articles. I'm now running a SvelteKit project in a monorepo that also has command line tools that shares code with SvelteKit. This is how I do it.

https://javascript.plainenglish.io/sharing-typescript-with-nx-and-turborepo-part-1-introduction-to-monorepos-d8d54b805e46

Please let me know of any issues you find.