Local Development of `remix-kit` dev

cliffordfajardo commented 1 year ago

Describe the bug

As a dev wanting to contribute to remix-kit, I would like to run the code in playground/react-app however the dev server is not not working. FYI i'm also new to pnpm based repo's 😅

Reproduction

No response

Steps to reproduce

Following the instructions in CONTRIBUTING.md:

Download a fresh clone of remix-kit (git clone https://github.com/jrestall/remix-kit.git)
cd into remix-kit & run pnpm install at the root of the remix-kit
Run `pnpm build:stub
cd into the playground/react-app folder
Run npx remix-kit dev

After step 5 I get the following error:

ℹ Starting Remix server... node ./build/server.dev.mjs                                                                                                                 04:33:26

node:internal/modules/cjs/loader:998                                                                                                                                   04:33:26
  throw err;
  ^

Error: Cannot find module '/Users/cliffordfajardo/repos/remix-kit/playground/react-app/build/server.dev.mjs'
    at Module._resolveFilename (node:internal/modules/cjs/loader:995:15)
    at Module._load (node:internal/modules/cjs/loader:841:27)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:81:12)
    at node:internal/main/run_main_module:23:47 {
  code: 'MODULE_NOT_FOUND',
  requireStack: []
}

Node.js v18.12.0

Video Reproduction

https://user-images.githubusercontent.com/6743796/209436577-ae8fb710-d9d2-447e-b4a2-d5731c919669.mp4

System Info

System:
    OS: macOS 13.0.1
    CPU: (10) arm64 Apple M1 Pro
    Memory: 161.72 MB / 16.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 18.12.0 - ~/.volta/tools/image/node/18.12.0/bin/node
    Yarn: 1.22.19 - ~/.volta/tools/image/yarn/1.22.19/bin/yarn
    npm: 8.19.2 - ~/.volta/tools/image/node/18.12.0/bin/npm
  Browsers:
    Chrome: 108.0.5359.124
    Safari: 16.1
  npmPackages:
    @remix-kit/cli: workspace:* => 0.1.2 
    @remix-kit/feature-blog: workspace: * => 0.1.2 
    @remix-kit/react: workspace:* => 0.1.2 
    @remix-kit/vite: workspace:* => 0.1.2 
    @remix-run/dev: ^1.8.2 => 1.8.2 
    @remix-run/eslint-config: ^1.8.2 => 1.8.2 
    @remix-run/express: ^1.8.2 => 1.8.2 
    @remix-run/node: ^1.8.2 => 1.8.2 
    @remix-run/react: ^1.8.2 => 1.8.2

Used Package Manager

npm

Validations

[X] Read the Contributing Guidelines.
[X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
[X] Make sure this is a RemixKit issue and not a Remix specific issue. For example, if it's a Remix related bug, it should likely be reported to remix instead.
[X] Check that this is a concrete bug. For Q&A open a GitHub Discussion.

jrestall commented 1 year ago

Thanks again @cliffordfajardo!

I've updated the contributing guidelines with more details on needing to run pnpm run build:server before pnpm run dev.

For the react-app you must run pnpm run build:server before pnpm run dev. If using stubs it doesn't currently work if the remix-react package has been stubbed, so you need to cd to packages/remix-react and run pnpm run prepack so that just that package isn't using jiti.

astahmer commented 1 year ago

hey, just stumbled on the same issue could it be worth adding a "postinstall": "pnpm build:server", you don't even need to know about this ?

jrestall commented 1 year ago

In the next release I'm hoping to bring the entire server files under Vite control, so there will be no need to build or modify them with RemixKitRunner. This will also solve the need to build the server file before running dev.

jrestall commented 1 year ago

This should now be fixed.

I've fixed the issue with jiti and @remix-kit/react by auto-injecting the ReactRefresh code so that there's no import to cause jiti issues.
Vite Node will now dynamically compile server.ts files so there's no need to run build:server before dev.

Make sure you are running pnpm run dev rather than npx remix-kit dev so that it passes the origin url of the remix app server from the npm scripts.

jrestall / remix-kit