remix-run/indie-stack

The Remix Stack for deploying to Fly with SQLite, authentication, testing, linting, formatting, etc.

indie-stack's Issues

Cache setup doesn't work on first run

Have you experienced this bug with the latest version of the template?

Yes, with a newly generated template

Steps to Reproduce

Generate the indie stack and follow the fly setup guide. No code has been changed at all.

Expected Behavior

Expected it to complete the build and deploy to Fly

Actual Behavior

After pushing to GitHub and running the deploy action, the Build step will fail with the following message:

2022-07-03T18:19:23.2351707Z #26 [stage-4 9/9] COPY --from=build /myapp/prisma /myapp/prisma
2022-07-03T18:19:23.2351952Z #26 DONE 0.0s
2022-07-03T18:19:23.3848909Z 
2022-07-03T18:19:23.3849344Z #27 exporting to image
2022-07-03T18:19:23.3849638Z #27 exporting layers
2022-07-03T18:19:31.5031990Z #27 exporting layers 8.1s done
2022-07-03T18:19:31.5032863Z #27 exporting manifest sha256:399ea710e69ea4a50399d69e21d9c97c102e3fabbe24f75032ddc54e69fa218c done
2022-07-03T18:19:31.5033348Z #27 exporting config sha256:3600d6bfa7a170576c647912aa4ac13c683983ca24889ee63db5f5d6993592a2 done
2022-07-03T18:19:31.5033684Z #27 pushing layers
2022-07-03T18:19:31.6539904Z #27 ...
2022-07-03T18:19:31.6540128Z 
2022-07-03T18:19:31.6542961Z #28 [auth] sharing credentials for registry.fly.io
2022-07-03T18:19:31.6543435Z #28 DONE 0.0s
2022-07-03T18:19:31.8043599Z 
2022-07-03T18:19:31.8044012Z #27 exporting to image
2022-07-03T18:19:32.0626042Z #27 pushing layers 0.7s done
2022-07-03T18:19:32.0664787Z #27 ERROR: unexpected status: 404 Not Found
2022-07-03T18:19:32.0666088Z ------
2022-07-03T18:19:32.0666304Z  > exporting to image:
2022-07-03T18:19:32.0666547Z ------
2022-07-03T18:19:32.0667177Z WARNING: local cache import at /tmp/.buildx-cache not found due to err: could not read /tmp/.buildx-cache/index.json: open /tmp/.buildx-cache/index.json: no such file or directory
2022-07-03T18:19:32.0741515Z error: failed to solve: unexpected status: 404 Not Found
2022-07-03T18:19:32.0894846Z ##[error]buildx failed with: error: failed to solve: unexpected status: 404 Not Found

Login falls back to default 'redirectTo' after faulty credentials

So I did this kinda silly thing and added loader to the Index Route and called requireUserId so that if not logged in browser should redirect straight to /login. I also added redirectTo parameter to /dashboard so after the login is succesful browser should redirect to that route.

// app/routes/index.tsx
export const loader: LoaderFunction = async ({ request }) => {
  await requireUserId(request, "/dashboard");
  return json({});
};

Everything worked just like I thought when given correct credentials right after landing to login (got 404 because no /dashboard route found, but redirection happend). But if I first submitted faulty credentials and after that give the correct ones, browser redirected to /notes which is used as fallback/default argument in almost every time in the login flow.

I think this is not the way redirection with login should work.

With the help of the URL in the browser I figured out that after returning json<ActionData>... from action in app/routes/login.tsx, searchParams got destroyed, so in the LoginPage component redirectTo falls back to /notes.

// app/routes/index.tsx
export default function LoginPage() {
  const [searchParams] = useSearchParams();
  const redirectTo = searchParams.get("redirectTo") || "/notes"; // <--- THIS LINE
  const actionData = useActionData() as ActionData;
...

I'm not sure where and how this should fixed so that it will not impact some core Remix stuff like works without JS. Maybe somwhere in action by returning it with errors.

( I also skimmed through the Jokes App and I think, the issue is present there too. )

LiveReload only for development

indie-stack/app/root.tsx

Line 46 in f02b3a6

<LiveReload />

Probably only need for development environment

@sendgrid/mail stopped by mock server development

Have you experienced this bug with the latest version of the template?

Yes

Steps to Reproduce

I'm not experienced enough to understand why, but running in local development stops the @sendgrid/mail api from working.

1. Create a remix app using this stack.
2. Install @sendgrid/mail from npm.
3. Follow the instructions to setup an API key and verify sender.
4. Use the example provided by SendGrid to send mail in an action on a route.
5. The promise never resolves, the request stays in the (pending) state for ever.

If you replace "dev:remix": "cross-env NODE_ENV=development binode --require ./mocks -- @remix-run/dev:remix dev", in package.json with "dev:remix": "cross-env NODE_ENV=development remix dev", it works as expected.

Expected Behavior

That the mock server would function as it does with other requests, log that the request was made with a message.

Actual Behavior

The mock server seems to block the requests by @sendgrid/mail.

LiveReload not functional on fresh install

Im using npm run dev and when it starts running my changes are not auto reloading.

Unexpected end of file tsconfig.json

Have you experienced this bug with the latest version of the template?

Yes

Steps to Reproduce

Commands

1. Run npx create-remix --template remix-run/indie-stack
2. Choose Typescript
3. Go to the folder
4. Run npm run dev pr npm run build

Setup

OS: Windows 11
Node.js: 16.15.0 and 18.1.0
NPM: 8.9.0
Shell: 7.3.0-preview.3

Expected Behavior

Fully working Remix after setup.

Actual Behavior

For npm run build it fails in the step build:remix, remix build:

For npm run dev it fails in Rebuilding phase.

Support `pnpm` natively

Pretty much the same as remix-run/blues-stack#37. The same packages need to be added to peerDependencies

remix.init failed

What version of Remix are you using?

1.6.8

Steps to Reproduce

Hello - First time trying out Remix and the Getting Started tutorial is immediately failing for me.

macOS Monteray
node version 18.7.0
npm 8.15.0

npx create-remix --template remix-run/indie-stack jake-start
? TypeScript or JavaScript? TypeScript
? Do you want me to run `npm install`? Yes

This is a new machine and I assume you would be aware of a problem like this so may it will end up being a me thing, but everything else seems to be working on my end.

Expected Behavior

No CLI errors and "the app should be running," including a 200 at localhost:3000.

Actual Behavior

🚨 Oops, remix.init failed

Cannot read properties of undefined (reading 'length')

More:

jake:~/repos/remix-getting-started$ npx create-remix --template remix-run/indie-stack jake-start
? TypeScript or JavaScript? TypeScript
? Do you want me to run `npm install`? Yes
npm WARN deprecated [email protected]: See https://github.com/lydell/source-map-url#deprecated
npm WARN deprecated [email protected]: Please see https://github.com/lydell/urix#deprecated
npm WARN deprecated [email protected]: https://github.com/lydell/resolve-url#deprecated
npm WARN deprecated [email protected]: This package has been deprecated and is no longer maintained. Please use @rollup/plugin-inject.
npm WARN deprecated [email protected]: See https://github.com/lydell/source-map-resolve#deprecated

added 1312 packages, and audited 1313 packages in 55s

231 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities
💿 Running remix.init script
🚨 Oops, remix.init failed

Cannot read properties of undefined (reading 'length')

There ends up being something which looks like an app in the folder, and npm run dev initially starts a server, but then loading a page results in:

Error: error: Environment variable not found: DATABASE_URL.
  -->  schema.prisma:3
   |
 2 |   provider = "sqlite"
 3 |   url      = env("DATABASE_URL")

Cypress fails on CI (github action)

Have you experienced this bug with the latest version of the template?

Yes

Steps to Reproduce

Create a new project, deploy it with the github action, it will fails as it seems there's a bug with the latests NPM version.

This is the error

npm ERR! 'npm ci' can only install packages when your package.json and package-lock.json or npm-shrinkwrap.json are in sync. Please update your lock file with 'npm install' before continuing.

FYI: I fix this issue changing the node version of the Cypress state to node-version: 16.10.0 (last v7 npm version) and it works.

Expected Behavior

Not fail in the cypress step on github action.

Actual Behavior

Cypress step of the build fails.

missing peer dependencies for `pnpm`

Have you experienced this bug with the latest version of the template?

yes

Steps to Reproduce

npx create-remix --template remix-run/indie-stack blog-tutorial
pnpm i

Expected Behavior

no errors or warnings

Actual Behavior

 ERR_PNPM_PEER_DEP_ISSUES  Unmet peer dependencies
.
├─┬ @remix-run/dev
│ └─┬ jscodeshift
│   └── ✕ missing peer @babel/preset-env@^7.1.6
└─┬ msw
  └── ✕ unmet peer typescript@">= 4.2.x <= 4.6.x": found 4.7.3

Remix Quickstart: Could not resolve "remix"

In the section Loading Data of Quickstart there is following code:

import { json, useLoaderData } from "remix";

After adding it there is an error:

ERROR: Could not resolve "remix"

It seems there is no such package in packages.json. Are remix docs not up to date?

Seed.js when starting a Typescript project

Have you experienced this bug with the latest version of the template?

remix-run/indie-stack blog-tutorial

Steps to Reproduce

run command:

npx create-remix --template remix-run/indie-stack blog-tutorial

then choose:

Typescript

Expected Behavior

in the prisma module, should be a file called seed.ts

Actual Behavior

the actual file is seed.js and some errors are occuring when using it

Docs: Link to 1password generator is 404'ing

Have you experienced this bug with the latest version of the template?

Yes

Steps to Reproduce

The Readme links to a 1password page that is 404'ing:

Spot in readme:

indie-stack/README.md

Line 108 in f9cea84

If you don't have openssl installed, you can also use [1password](https://1password.com/generate-password) to generate a random secret, just replace `$(openssl rand -hex 32)` with the generated secret.

404'ing URL: https://1password.com/generate-password

Expected Behavior

Seems like it meant to link to some web app to generate a random hex string.

Actual Behavior

Remix.init fails when choosing TypeScript

Have you experienced this bug with the latest version of the template?

Yes

Steps to Reproduce

? What type of app do you want to create? A pre-configured stack ready for production
? Which Stack do you want? (Learn more about these stacks: 'https://remix.run/stacks') Indie
? TypeScript or JavaScript? TypeScript
? Do you want me to run npm install? Yes

💿 Running remix.init script
🚨 Oops, remix.init failed

index.js:readFileIfNotTypeScript seems to have wrong brackets

Current:

  (isTypeScript ? Promise.resolve() : fs.readFile(filePath, "utf-8")).then(
    parseFunction
  );

Expected

  (isTypeScript ? Promise.resolve() : fs.readFile(filePath, "utf-8").then(
    parseFunction
  ));

Expected Behavior

remix.init should run successfully

Actual Behavior

remix.init fails

Fix JavaScript version

Have you experienced this bug with the latest version of the template?

Yes

Steps to Reproduce

Create a new project with this template and choose JavaScript.

Expected Behavior

No errors when running npm run validate

Actual Behavior

After @MichaelDeBoey's PR #127 it looks like there are still more fixes to be made.

I ran into a couple issues when running npm run validate:

TypeError: tsconfigPaths is not a function

After fixing that, I got:

/Users/kentcdodds/Desktop/my-remix-app/app/routes/notes/$noteId.jsx
  6:1  warning  '~/models/note.server' import is duplicated  no-duplicate-imports

/Users/kentcdodds/Desktop/my-remix-app/cypress/e2e/smoke.cy.js
   3:1  error  'describe' is not defined   no-undef
   4:3  error  'afterEach' is not defined  no-undef
   5:5  error  'cy' is not defined         no-undef
   8:3  error  'it' is not defined         no-undef
  14:5  error  'cy' is not defined         no-undef
  16:5  error  'cy' is not defined         no-undef
  18:5  error  'cy' is not defined         no-undef
  20:5  error  'cy' is not defined         no-undef
  21:5  error  'cy' is not defined         no-undef
  22:5  error  'cy' is not defined         no-undef
  24:5  error  'cy' is not defined         no-undef
  25:5  error  'cy' is not defined         no-undef
  26:5  error  'cy' is not defined         no-undef
  29:3  error  'it' is not defined         no-undef
  35:5  error  'cy' is not defined         no-undef
  37:5  error  'cy' is not defined         no-undef
  39:5  error  'cy' is not defined         no-undef
  40:5  error  'cy' is not defined         no-undef
  42:5  error  'cy' is not defined         no-undef
  44:5  error  'cy' is not defined         no-undef
  45:5  error  'cy' is not defined         no-undef
  46:5  error  'cy' is not defined         no-undef
  48:5  error  'cy' is not defined         no-undef
  50:5  error  'cy' is not defined         no-undef

/Users/kentcdodds/Desktop/my-remix-app/cypress/support/commands.js
   6:3   error  'cy' is not defined                                                  no-undef
   7:3   error  'cy' is not defined                                                  no-undef
  13:5   error  'cy' is not defined                                                  no-undef
  15:10  error  'cy' is not defined                                                  no-undef
  22:5   error  'cy' is not defined                                                  no-undef
  29:3   error  'cy' is not defined                                                  no-undef
  33:3   error  'cy' is not defined                                                  no-undef
  37:3   error  'cy' is not defined                                                  no-undef
  46:3   error  'cy' is not defined                                                  no-undef
  47:3   error  'cy' is not defined                                                  no-undef
  50:1   error  'Cypress' is not defined                                             no-undef
  51:1   error  'Cypress' is not defined                                             no-undef
  52:1   error  'Cypress' is not defined                                             no-undef
  54:1   error  Definition for rule '@typescript-eslint/no-namespace' was not found  @typescript-eslint/no-namespace

/Users/kentcdodds/Desktop/my-remix-app/cypress/support/e2e.js
  4:1  error  'Cypress' is not defined  no-undef

✖ 40 problems (39 errors, 1 warning)

Running npm run test:e2e:run I got:

Your configFile is invalid: /Users/kentcdodds/Desktop/my-remix-app/cypress.config.js

It threw an error when required, check the stack trace below:

/Users/kentcdodds/Desktop/my-remix-app/cypress.config.js:3
export default defineConfig({
^^^^^^

SyntaxError: Unexpected token 'export'
    at Object.compileFunction (node:vm:353:18)
    at wrapSafe (node:internal/modules/cjs/loader:1040:15)
    at Module._compile (node:internal/modules/cjs/loader:1076:27)
    at Module._extensions..js (node:internal/modules/cjs/loader:1166:10)
    at Module.load (node:internal/modules/cjs/loader:988:32)
    at Module._load (node:internal/modules/cjs/loader:834:12)
    at Module.require (node:internal/modules/cjs/loader:1012:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at loadFile (/Users/kentcdodds/Library/Caches/Cypress/10.4.0/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_require_async_child.js:89:14)
    at EventEmitter.<anonymous> (/Users/kentcdodds/Library/Caches/Cypress/10.4.0/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_require_async_child.js:116:38)
    at EventEmitter.emit (node:events:537:28)
    at process.<anonymous> (/Users/kentcdodds/Library/Caches/Cypress/10.4.0/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/util.js:33:22)
    at process.emit (node:events:537:28)
    at emit (node:internal/child_process:937:14)
    at process.processTicksAndRejections (node:internal/process/task_queues:83:21)

Error: Command failed with exit code 1: npx cypress run
    at makeError (/Users/kentcdodds/Desktop/my-remix-app/node_modules/start-server-and-test/node_modules/execa/lib/error.js:60:11)
    at handlePromise (/Users/kentcdodds/Desktop/my-remix-app/node_modules/start-server-and-test/node_modules/execa/index.js:118:26)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
  shortMessage: 'Command failed with exit code 1: npx cypress run',
  command: 'npx cypress run',
  escapedCommand: '"npx cypress run"',
  exitCode: 1,
  signal: undefined,
  signalDescription: undefined,
  stdout: undefined,
  stderr: undefined,
  failed: true,
  timedOut: false,
  isCanceled: false,
  killed: false
}
NPM command npm run test:e2e:run -- failed with code 1

Oops, remix.init failed when choosing Javascript instead of Typescript

Have you experienced this bug with the latest version of the template?

yes

Steps to Reproduce

Running: npx create-remix --template remix-run/indie-stack gives an error when selecting the Javascript option instead of the Typescript option:

Environment variables loaded from .env
Prisma schema loaded from prisma/schema.prisma
Datasource "db": SQLite database "data.db" at "file:./data.db?connection_limit=1"

SQLite database data.db created at file:./data.db?connection_limit=1

Applying migration `20220307190657_init`

The following migration(s) have been applied:

migrations/
  └─ 20220307190657_init/
    └─ migration.sql

Your database is now in sync with your schema.

✔ Generated Prisma Client (3.11.1 | library) to ./node_modules/@prisma/client in
 244ms


Running seed command `ts-node --require tsconfig-paths/register prisma/seed.ts` ...
node:internal/modules/cjs/loader:936
  throw err;
  ^

Error: Cannot find module './seed.ts'
Require stack:
- /Users/jan/Sites/remix-run/prisma/imaginaryUncacheableRequireRes

Expected Behavior

I'd expect the seed.ts being a .jsx file when using the Javascript option. Think this is coming from the package.json script:

"seed": "ts-node --require tsconfig-paths/register prisma/seed.ts"

Think basically the script should be changed to use the prisma/seed.js file when using the Javascript option. That file is present.

Actual Behavior

The seed.ts file is not present so the seedscript fails. There is however a prisma/seed.js file available.

Can not add custom component into index, but works in other route

I'm trying something with this template, but meet a wired error which says:

Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: object. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

What I did is just create a custom test component and use it in the index route.

The component itself is like:

// app/components/navbar.client.tsx

export default function Navbar() {
  return (<div>Navbar</div>);
}

Use it in the index route:

// app/routes/index.tsx
import Navbar from "~/components/navbar.client";

export default function Index() {
  console.log(Navbar); // outputs the imported Navbar function

  return (
    <main>
      <Navbar />
    </main>
  );
}

If I put the component in other route like login, it is totally fine and just renders. So what did I do wrong?
Sorry if this is silly, I'm a front end developer not knowing much about server side rendering.

Cypress suite broken

Have you experienced this bug with the latest version of the template?

yes

Steps to Reproduce

run cypress suite from a fresh install

Expected Behavior

Cypress tests fail. It seems to be failing at different stages but seems it consistently fails at actions like .click() and .type()

Actual Behavior

They should be passing

Live Reload stops working soon after initial page refresh

Have you experienced this bug with the latest version of the template?

yes

Steps to Reproduce

Ive created a site from the indie template and I have configured LiveReload I think correctly as it works when i initially load the page. However after a short duration - about 2 minutes - it just stops working. there are no console errors nor further network requests. Making continuous updates will extend this duration. Once deactivated the only way to reactivate live reload is to refresh the page. As a reasonable guess I think maybe the socket connection is timing out on the server.

here's my environment for the Indie installation.

.env

REMIX_DEV_SERVER_WS_PORT=443

and nginx config:

server {
    listen 80;
    server_name remix1.syntapse.co.uk;
    location / {
        proxy_pass http://0.0.0.0:3300;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }
    location /socket {
        proxy_pass http://0.0.0.0:443;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }
}

Expected Behavior

livereload should work after any reasonable period of development activity, without intermittent updates.

Actual Behavior

livereload stops working after about 2 minutes and reactivates upon a page refresh before the expiry repeats.

interceptors.createInterceptor is not a function

Have you experienced this bug with the latest version of the template?

Yes

Steps to Reproduce

1. clone this repository or run npx create-remix --template remix-run/indie-stack blog-tutorial (following this quickstart tutorial https://remix.run/docs/en/v1/tutorials/blog)
2. npm run dev

Expected Behavior

the app should be running on http://localhost:3000/,

Actual Behavior

throw an error:

`> Executing task: npm run dev <

dev
run-p dev:*

dev:css
npm run generate:css -- --watch

dev:remix
cross-env NODE_ENV=development binode --require ./mocks -- @remix-run/dev:remix dev

C:\Users\vikas\source\repos\temp\remix-experiments\indie-stack\node_modules\msw\node\lib\index.js:8143
const interceptor = interceptors.createInterceptor({
^

TypeError: interceptors.createInterceptor is not a function
at setupServer (C:\Users\vikas\source\repos\temp\remix-experiments\indie-stack\node_modules\msw\node\lib\index.js:8143:42)
at Object. (C:\Users\vikas\source\repos\temp\remix-experiments\indie-stack\mocks\index.js:3:16)
at Module._compile (node:internal/modules/cjs/loader:1105:14)
at Object.Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
at Module.load (node:internal/modules/cjs/loader:981:32)
at Function.Module._load (node:internal/modules/cjs/loader:822:12)
at Module.require (node:internal/modules/cjs/loader:1005:19)
at Module._preloadModules (node:internal/modules/cjs/loader:1282:12)
at loadPreloadModules (node:internal/bootstrap/pre_execution:539:5)
at prepareMainThreadExecution (node:internal/bootstrap/pre_execution:85:3)

generate:css
tailwindcss -o ./app/styles/tailwind.css "--watch"

Rebuilding...
Done in 269ms.`

Error deploying - cant find module @node-rs/bcrypt-linux-x64-gnu

System: MacOS 12.0.1 (M1)
Node and Npm: v16.14.2

Error:
When running the deploy GitHub action there are 2 places where it fails due to it being unable to find module @node-rs/bcrypt-linux-x64-gnu. This happens in both the Cypress step when it runs Run npx prisma db seed and again on the npm run start step in 'Deploy production'.

Deploy production step:

2022-03-23T08:05:18Z   [info]No pending migrations to apply.
2022-03-23T08:05:19Z   [info]+ npm run start
2022-03-23T08:05:19Z   [info]> start
2022-03-23T08:05:19Z   [info]> remix-serve build
2022-03-23T08:05:19Z   [info]Error: Cannot find module '@node-rs/bcrypt-linux-x64-gnu'

Cypress step:

Run npx prisma db seed
Environment variables loaded from .env
Running seed command `node --require esbuild-register prisma/seed.ts` ...
Error: Cannot find module '@node-rs/bcrypt-linux-x[6](https://github.com/mtmeyer/awesome-project/runs/5656658657?check_suite_focus=true#step:8:6)4-gnu'

Not sure if this is an issue with my setup or in the repo. I've just created the project using npx create-remix@latest and have followed all the steps in the readme to get it deployed. Only change I've made is to swap the binode commands in package.json to what they were before as thats not working for me as outlined in Issue 26

Stack fails setup when precompiled Prisma engines are not available.

Have you experienced this bug with the latest version of the template?

Yes

Steps to Reproduce

On NixOS or in a Nix Shell, run npx create-remix --template remix-run/indie-stack

View Output

Need to install the following packages:
  create-remix
Ok to proceed? (y) y
? Where would you like to create your app? ./test-stack
? Do you want me to run `npm install`? Yes
npm WARN deprecated [email protected]: See https://github.com/lydell/source-map-url#deprecated
npm WARN deprecated [email protected]: Please see https://github.com/lydell/urix#deprecated
npm WARN deprecated [email protected]: See https://github.com/lydell/source-map-resolve#deprecated
npm WARN deprecated [email protected]: https://github.com/lydell/resolve-url#deprecated
npm WARN deprecated [email protected]: This package has been deprecated and is no longer maintained. Please use @rollup/plugin-inject.
npm WARN deprecated [email protected]: See https://github.com/lydell/source-map-resolve#deprecated

added 1328 packages, and audited 1329 packages in 19s

235 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities
? TypeScript or JavaScript? TypeScript
💿 Running remix.init script

> setup
> prisma migrate dev && prisma db seed

Warning Precompiled engine files are not available for nixos.
Environment variables loaded from .env
Prisma schema loaded from prisma/schema.prisma
Datasource "db": SQLite database "data.db" at "file:./data.db?connection_limit=1"


The following migration(s) have been applied:

migrations/
  └─ 20220307190657_init/
    └─ migration.sql

Your database is now in sync with your schema.

Running generate... (Use --skip-generate to skip the generators)
Warning Precompiled engine files are not available for nixos.
TypeError: collection is not iterable
    at keyBy (/home/short/work/test-stack/node_modules/@prisma/client/generator-build/index.js:57531:21)
    at Object.getTypeMap (/home/short/work/test-stack/node_modules/@prisma/client/generator-build/index.js:59314:17)
    at new DMMFHelper (/home/short/work/test-stack/node_modules/@prisma/client/generator-build/index.js:59211:25)
    at new TSClient (/home/short/work/test-stack/node_modules/@prisma/client/generator-build/index.js:60494:17)
    at buildClient (/home/short/work/test-stack/node_modules/@prisma/client/generator-build/index.js:60740:18)
    at generateClient (/home/short/work/test-stack/node_modules/@prisma/client/generator-build/index.js:60811:47)
    at async LineStream.<anonymous> (/home/short/work/test-stack/node_modules/@prisma/client/generator-build/index.js:54039:24)


Warning Precompiled engine files are not available for nixos.
Environment variables loaded from .env
Running seed command `ts-node --require tsconfig-paths/register prisma/seed.ts` ...
/home/short/work/test-stack/node_modules/.prisma/client/index.js:3
    throw new Error(
          ^
Error: @prisma/client did not initialize yet. Please run "prisma generate" and try to import it again.
In case this error is unexpected for you, please report it in https://github.com/prisma/prisma/issues
    at new PrismaClient (/home/short/work/test-stack/node_modules/.prisma/client/index.js:3:11)
    at Object.<anonymous> (/home/short/work/test-stack/prisma/seed.ts:4:16)
    at Module._compile (node:internal/modules/cjs/loader:1099:14)
    at Module.m._compile (/home/short/work/test-stack/node_modules/ts-node/src/index.ts:1455:23)
    at Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
    at Object.require.extensions.<computed> [as .ts] (/home/short/work/test-stack/node_modules/ts-node/src/index.ts:1458:12)
    at Module.load (node:internal/modules/cjs/loader:975:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:77:12)
    at phase4 (/home/short/work/test-stack/node_modules/ts-node/src/bin.ts:567:12)

An error occured while running the seed command:
Error: Command failed with exit code 1: ts-node --require tsconfig-paths/register prisma/seed.ts
🚨 Oops, remix.init failed

Command failed: npm run setup

---

Investigating a bit, it seems that running prisma generate prior to running npm run setup will succeed.

1. Run prisma generate

View Output

Warning Precompiled binaries are not available for nixos.
Environment variables loaded from .env
Prisma schema loaded from prisma/schema.prisma
Warning Precompiled binaries are not available for nixos.
[Error: ENOENT: no such file or directory, mkdir '/nix/store/vn57rafwfanmrzjndnlcr4q56r55p9k8-prisma-3.12.0/lib/node_modules/prisma/engines'] {
  errno: -2,
  code: 'ENOENT',
  syscall: 'mkdir',
  path: '/nix/store/vn57rafwfanmrzjndnlcr4q56r55p9k8-prisma-3.12.0/lib/node_modules/prisma/engines'
}
Warning Precompiled binaries are not available for nixos.

✔ Generated Prisma Client (3.14.0 | library) to ./node_modules/@prisma/client in 75ms
You can now start using Prisma Client in your code. Reference: https://pris.ly/d/client
```
import { PrismaClient } from '@prisma/client'
const prisma = new PrismaClient()
```

warn Versions of [email protected] and @prisma/[email protected] don't match.
This might lead to unexpected behavior.
Please make sure they have the same version.

2. Run npm run setup

View Output

> setup
> prisma migrate dev && prisma db seed

Warning Precompiled engine files are not available for nixos.
Environment variables loaded from .env
Prisma schema loaded from prisma/schema.prisma
Datasource "db": SQLite database "data.db" at "file:./data.db?connection_limit=1"

Already in sync, no schema change or pending migration was found.

Running generate... (Use --skip-generate to skip the generators)
Warning Precompiled engine files are not available for nixos.
TypeError: collection is not iterable
    at keyBy (/home/short/work/test-stack/node_modules/@prisma/client/generator-build/index.js:57531:21)
    at Object.getTypeMap (/home/short/work/test-stack/node_modules/@prisma/client/generator-build/index.js:59314:17)
    at new DMMFHelper (/home/short/work/test-stack/node_modules/@prisma/client/generator-build/index.js:59211:25)
    at new TSClient (/home/short/work/test-stack/node_modules/@prisma/client/generator-build/index.js:60494:17)
    at buildClient (/home/short/work/test-stack/node_modules/@prisma/client/generator-build/index.js:60740:18)
    at generateClient (/home/short/work/test-stack/node_modules/@prisma/client/generator-build/index.js:60811:47)
    at async LineStream.<anonymous> (/home/short/work/test-stack/node_modules/@prisma/client/generator-build/index.js:54039:24)


Warning Precompiled engine files are not available for nixos.
Environment variables loaded from .env
Running seed command `ts-node --require tsconfig-paths/register prisma/seed.ts` ...
Database has been seeded. 🌱

🌱  The seed command has been executed.

Expected Behavior

The stack should not fail due to precompiled Prisma engines not existing. Instead, prisma generate should be run first or the Prisma step should be skipped and the reponsibility of performing Prisma setup handed to the user.

Actual Behavior

When attempting to setup a new project using this Remix Stack, the process fails before completing. Precompiled Prisma engines are not available in a Nix environment due to how packages, linking, and the environment are configured. Instead, it is expected that prisma generate is run to generate a client that uses Nix's version of Prisma since Nix environments are typically created per-project as seen here.

Use current password instead of new password for login page for autoComplete

indie-stack/app/routes/login.tsx

Line 140 in f4cfbf1

autoComplete="new-password"

Use autoComplete="current-password" instead of new-password on the login page

Ref: https://web.dev/sign-in-form-best-practices/

Could not resolve "remix" (following developer blog tutorial)

I was following the developer blog tutorial: https://remix.run/docs/en/v1/tutorials/blog

I ran the setup npx create-remix --template remix-run/indie-stack blog-tutorial.

It then recommends adding this code:

import { json, useLoaderData } from "remix";

But an error is thrown:

Could not resolve "remix"

I noticed this recent commit: 399001c

So I tried the same change:

import { json } from "@remix-run/node";
import { useLoaderData } from "@remix-run/react";

And it worked as expected.

This might only require updating the tutorial since it uses this template? I couldn't find any other documentation related to using @remix-run/react and @remix-run/node over remix?

NPM run dev failing

I keep getting the following when I run 'NPM run dev' and I can't seem to figure out the problem. Do you have any suggestions? thank you so much

dev:css
npm run generate:css -- --watch

dev:remix
node --require ./mocks ./node_modules/.bin/remix dev

🔶 Mock server running
SyntaxError: missing ) after argument list

Setup script runs db seed script twice when using sqlite.

Have you experienced this bug with the latest version of the template?

Yes

Steps to Reproduce

1. Create fresh indie stack project.
2. Run npm run setup

Expected Behavior

1. prisma migrate dev runs, syncing database and generating client
2. when migrating is complete, prisma db seed runs, seeding the database according to seed.ts

Actual Behavior

1. prisma migrate dev runs, and in addition to syncing db and generating client, it also runs the seed script.
2. prisma db seed runs, and fails when it hits a unique constraint because the db has already been seeded
   remixSeedSqliteIssue.txt
   .

Redirect after Login not working in Firefox 72, 80

Have you experienced this bug with the latest version of the template?

yes

Steps to Reproduce

npx create-remix --template remix-run/indie-stack
cd ./projectFolder/
npm run dev

go to /login
input credentials and click "Log In"

Expected Behavior

get redirected to /notes

Actual Behavior

after clicking "Log In" URL in Address Bar changes to /notes but browser still displays content of /login page

"Invariant failed" on npm start

We're getting this error when on npm start after a migration command. I don't think there are more stack lines, though. Any idea if this is a misconfig or a bug of some kind?

```Preparing to run: sh start.sh as root
fra [info]+ npx prisma migrate deploy
Datasource "db": SQLite database "sqlite.db" at "file:/data/sqlite.db"
No pending migrations to apply.

• npm run start

start
remix-serve build
/myapp/node_modules/tiny-invariant/dist/tiny-invariant.cjs.js:10
throw new Error(prefix);
^
Error: Invariant failed
at invariant (/myapp/node_modules/tiny-invariant/dist/tiny-invariant.cjs.js:10:15)
at Object. (/myapp/build/index.js:443:35)
at Module._compile (node:internal/modules/cjs/loader:1103:14)
at Object.Module._extensions..js (node:internal/modules/cjs/loader:1157:10)
at Module.load (node:internal/modules/cjs/loader:981:32)
at Function.Module._load (node:internal/modules/cjs/loader:822:12)
at Module.require (node:internal/modules/cjs/loader:1005:19)
at require (node:internal/modules/cjs/helpers:102:18)

npm run setup fails for indie-stack template

Have you experienced this bug with the latest version of the template?

Yes

Steps to Reproduce

run npx create-remix@latest --template remix-run/indie-stack
? Where would you like to create your app? blog-tutorial
? TypeScript or JavaScript? TypeScript
? Do you want me to run npm install? Yes

Expected Behavior

It should successfully complete the setup as well as npm run dev locally.

Actual Behavior

✔ Generated Prisma Client (4.0.0 | library) to ./node_modules/@prisma/client in 389ms
You can now start using Prisma Client in your code. Reference: https://pris.ly/d/client

import { PrismaClient } from '@prisma/client'
const prisma = new PrismaClient()

Environment variables loaded from .env
Prisma schema loaded from prisma/schema.prisma
Error: Get Config: Schema parsing - Error while interacting with query-engine-node-api library
Error code: P1012
error: Error validating datasource `db`: the URL must start with the protocol `file:`.
  -->  schema.prisma:3
   | 
 2 |   provider = "sqlite"
 3 |   url      = env("DATABASE_URL")
   | 

Validation Error Count: 1

Prisma CLI Version : 4.0.0
🚨 Oops, remix.init failed

Command failed: npm run setup

Error: Environment variable not found: DATABASE_URL.

I'm getting the error after creating the project: Error: error: Environment variable not found: DATABASE_URL.

OS: MacOS

Steps to reproduce:

1. Run npx create-remix --template remix-run/indie-stack test-proj
2. Run npm run dev
3. Open http://localhost:3000 in the browser

Result:
Remix App Server started at http://localhost:3000 (http://192.168.0.47:3000)
Error: error: Environment variable not found: DATABASE_URL.
--> schema.prisma:3
|
| provider = "sqlite"
| url = env("DATABASE_URL")
|

JS version: Warning: Expected server HTML to contain a matching <link> in <body>.

Have you experienced this bug with the latest version of the template?

yes

Steps to Reproduce

• npx create-remix@latest (indie stack, javascript version)
• npm run dev

Expected Behavior

Expected no error while opening localhost:3000

Actual Behavior

Getting a bunch of error in console:

create-remix cli run into error when trying to run `npx remix init`

What version of Remix are you using?

1.6.7

Steps to Reproduce

Run create-remix cli with options below:

---

Expected Behavior

The cli run remix.init script successfully

Actual Behavior

The remix.init script run into error

🚨 Oops, remix.init failed
Cannot read properties of undefined (reading 'length')

Feature request: Include a REMIX_DEV_CLIENT_WS_PORT .env variable to better facilitate proxied remix apps.

Have you experienced this bug with the latest version of the template?

yes

Steps to Reproduce

I am running my remix dev server behind an nginx reverse proxy and I cant find a way to define the public websocket URL in a manner similar to other React SSR frameworks to access the proxied socket port.

package.json

  "scripts": {
     ...,
     "dev": "PORT=3300 run-p dev:*",
     ...
   }

remix.config.js (this is ignored so Im using .env variable instead)

module.exports = {
  ...
  devServerPort: 3301
};

.env file (this appears to supercede devServerPort setting in remix.config.js)

REMIX_DEV_SERVER_WS_PORT=3301

and I am reverse proxying requests through nginx

and routing the app through nginx

server {
    listen 80;
    server_name remix1.syntapse.co.uk;
    location / {
        proxy_pass http://0.0.0.0:3300;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }

    location /socket {
        proxy_pass http://0.0.0.0:3001/browser-sync/socket.io;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }
}

Reverse proxying the app works through port 3000 as expected but livereload is not working as socket URL is not compatiably with a reverse proxy. When I load into the browser I see a browser network error:

(index):26 WebSocket connection to 'wss://mydomain.com:3301/socket' failed:

The inclusion of the port in the client URL wont work for a reverse proxied connection where all requests are generally routed to a single port and re-routed through the reverse proxy. A new env var to allow a port forwarding would be advantageous.

Expected Behavior

Next JS, CRA and Razzle all provide some means to define the public socket URL for reverse proxied development versions of an app.

Actual Behavior

A single port specification does not support proxied connections where the client side and server side ports will most likely differ.

`npx create-remix --template remix-run/indie-stack` asks different questions depending on app name

Have you experienced this bug with the latest version of the template?

Yes

Steps to Reproduce

1. Run npx create-remix --template remix-run/indie-stack and name the app as my-app or asdf.
2. See "Where do you want to deploy?" question

3. CTRL+C to cancel
4. Again, run npx create-remix --template remix-run/indie-stack but this time name the app create-remix-app-indie-stack.
5. See "What type of app do you want to create?" question

Expected Behavior

I expect the questions I'm asked not to change depending on the name I use for my app.

Actual Behavior

The questions I'm asked change depending on the name I give my app.

Screen recording:

CleanShot.2022-04-14.at.14.23.32.mp4

System and install Node versions:

~ 
❯ npx -v
8.1.2

~ 
❯ npm -v
8.1.2

~ 
❯ node -v
v16.13.2

~ 
❯ uname -a
Darwin noodles.local 21.4.0 Darwin Kernel Version 21.4.0: Fri Mar 18 00:45:05 PDT 2022; root:xnu-8020.101.4~15/RELEASE_X86_64 x86_64

~ 
❯ sw_vers
ProductName:	macOS
ProductVersion:	12.3.1
BuildVersion:	21E258

Deploy fly.io error, app runs fine locally

Have you experienced this bug with the latest version of the template?

Yes, repo at https://github.com/SangeetAgarwal/bitoflearning

Steps to Reproduce

If you were to clone https://github.com/SangeetAgarwal/bitoflearning then you'll see it runs just fine with either the npm run dev or npm run build and npm start.

But when I attempt to deploy to fly.io then at https://bitoflearning-9a57.fly.dev/ then I get the following error in the deploy stage

2022-07-27T12:51:34Z [info] at /myapp/build/index.js:615:111
2022-07-27T12:51:34Z [info] at getAllFilesRecursively (/myapp/build/index.js:615:623)
2022-07-27T12:51:34Z [info] at getAllFilesFrontMatter (/myapp/build/index.js:634:85)
2022-07-27T12:51:34Z [info] at loader5 (/myapp/build/index.js:738:43)
2022-07-27T12:51:34Z [info] at Object.callRouteLoader (/myapp/node_modules/@remix-run/server-runtime/dist/data.js:77:20)
2022-07-27T12:51:34Z [info] at /myapp/node_modules/@remix-run/server-runtime/dist/server.js:261:113
2022-07-27T12:51:34Z [info] at Array.map ()
2022-07-27T12:51:34Z [info]HEAD / 500 - - 4.089 ms
2022-07-27T12:51:34Z [info]healthcheck {

Expected Behavior

app should run and show the landing page at https://bitoflearning-9a57.fly.dev/

Actual Behavior

But when I attempt to deploy to fly.io then at https://bitoflearning-9a57.fly.dev/ then I get the following error in the deploy stage

2022-07-27T12:51:34Z [info] at /myapp/build/index.js:615:111
2022-07-27T12:51:34Z [info] at getAllFilesRecursively (/myapp/build/index.js:615:623)
2022-07-27T12:51:34Z [info] at getAllFilesFrontMatter (/myapp/build/index.js:634:85)
2022-07-27T12:51:34Z [info] at loader5 (/myapp/build/index.js:738:43)
2022-07-27T12:51:34Z [info] at Object.callRouteLoader (/myapp/node_modules/@remix-run/server-runtime/dist/data.js:77:20)
2022-07-27T12:51:34Z [info] at /myapp/node_modules/@remix-run/server-runtime/dist/server.js:261:113
2022-07-27T12:51:34Z [info] at Array.map ()
2022-07-27T12:51:34Z [info]HEAD / 500 - - 4.089 ms
2022-07-27T12:51:34Z [info]healthcheck {

Template is not working in Firefox

Have you experienced this bug with the latest version of the template?

yes

Steps to Reproduce

• init template
• npm run dev
• open http://localhost:3000 in Firefox browser

Expected Behavior

Actual Behavior

IIndieStack init app `TypeError: formData is not iterable` on login

What version of Remix are you using?

1.5.1

Steps to Reproduce

init app with

npx create-remix@latest

npm install - yes
TypeScript - yes
then
npm run dev
go to login page and type seeded account login/password

Expected Behavior

Successful login

Actual Behavior

tried it multiple times - same result

envinfo:

  System:
    OS: macOS 12.2
    CPU: (10) arm64 Apple M1 Pro
    Memory: 464.61 MB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 16.15.0 - ~/.nvm/versions/node/v16.15.0/bin/node
    Yarn: 1.22.18 - ~/.nvm/versions/node/v16.15.0/bin/yarn
    npm: 8.5.5 - ~/.nvm/versions/node/v16.15.0/bin/npm
  Managers:
    Homebrew: 3.5.1 - /opt/homebrew/bin/brew
    pip3: 20.2.3 - /usr/bin/pip3
    RubyGems: 3.0.3.1 - /usr/bin/gem
  Utilities:
    Make: 3.81 - /usr/bin/make
    GCC: 13.1.6 - /usr/bin/gcc
    Git: 2.32.1 - /usr/bin/git
    Clang: 13.1.6 - /usr/bin/clang
  Servers:
    Apache: 2.4.51 - /usr/sbin/apachectl
  Virtualization:
    Docker: 20.10.14 - /usr/local/bin/docker
    Parallels: 17.1.2 - /usr/local/bin/prlctl
  IDEs:
    Nano: 2.0.6 - /usr/bin/nano
    VSCode: 1.67.2 - /usr/local/bin/code
    Vim: 8.2 - /usr/bin/vim
    Xcode: /undefined - /usr/bin/xcodebuild
  Languages:
    Bash: 3.2.57 - /bin/bash
    Java: 17.0.3 - /usr/bin/javac
    Perl: 5.30.3 - /usr/bin/perl
    Python: 2.7.18 - /usr/bin/python
    Python3: 3.8.9 - /usr/bin/python3
    Ruby: 2.6.8 - /usr/bin/ruby
  Databases:
    SQLite: 3.36.0 - /usr/bin/sqlite3
  Browsers:
    Chrome: 102.0.5005.115
    Safari: 15.3

create app log

❯ npx create-remix@latest
? Where would you like to create your app? ./my-remix-app
? What type of app do you want to create? A pre-configured stack ready for 
production
? Which Stack do you want? (Learn more about these stacks: 
https://remix.run/stacks) Indie
? Do you want me to run `npm install`? Yes
⠇ Creating your app…(⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂) ⠴ idealTree:my-remix-app: sill idealTrenpm WARN deprecated [email protected]: See https://github.com/lydell/source-map-url#deprecated
npm WARN deprecated [email protected]: Please see https://github.com/lydell/urix#deprecated
npm WARN deprecated [email protected]: See https://github.com/lydell/source-map-resolve#deprecated
npm WARN deprecated [email protected]: https://github.com/lydell/resolve-url#deprecated
npm WARN deprecated [email protected]: This package has been deprecated and is no longer maintained. Please use @rollup/plugin-inject.
npm WARN deprecated [email protected]: See https://github.com/lydell/source-map-resolve#deprecated

added 1329 packages, and audited 1330 packages in 2m

235 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities
? TypeScript or JavaScript? TypeScript
💿 Running remix.init script

> setup
> prisma migrate dev && prisma db seed

Environment variables loaded from .env
Prisma schema loaded from prisma/schema.prisma
Datasource "db": SQLite database "data.db" at "file:./data.db?connection_limit=1"

SQLite database data.db created at file:./data.db?connection_limit=1

Applying migration `20220307190657_init`

The following migration(s) have been applied:

migrations/
  └─ 20220307190657_init/
    └─ migration.sql

Your database is now in sync with your schema.

✔ Generated Prisma Client (3.15.1 | library) to ./node_modules/@prisma/client in
 266ms


Running seed command `ts-node --require tsconfig-paths/register prisma/seed.ts` ...
Database has been seeded. 🌱

🌱  The seed command has been executed.


Environment variables loaded from .env
Running seed command `ts-node --require tsconfig-paths/register prisma/seed.ts` ...
Database has been seeded. 🌱

🌱  The seed command has been executed.
Setup is complete. You're now ready to rock and roll 🤘

Start development with `npm run dev`
💿 That's it! `cd` into "/Users/vladimirsemenov/external/my-remix-app" and check the README for development and deploy instructions!

After creating new table, version that was deployed to fly get an error

Have you experienced this bug with the latest version of the template?

Yes

Steps to Reproduce

Deploy fresh app to the stage server, than create new table, and push to dev again, after this will deployed to server, observe the error

Expected Behavior

Migration work the same as in local environment

Actual Behavior

Migration in server doesn't work

Unable to run latest IndieStack (JS) on Windows

Have you experienced this bug with the latest version of the template?

Yes

Steps to Reproduce

Windows 10 Pro
NPM: '8.5.4'
Node: '16.16.0'
JS/TS: JS

npx create-remix --template remix-run/indie-stack
Select 'JavaScript'
cd
npm run dev
hit localhost:3000
app crashes (see errors in Actual Behavior)

Expected Behavior

App remains operational

Actual Behavior

App errors before loading:

Console:

remix.config.js devServerPort setting not being observed and there is no configuration to alter public URL for proxied socket connections.

Have you experienced this bug with the latest version of the template?

yes

Steps to Reproduce

This is not a duplicate of remix-run/remix#2620 as it contains some nuances relating to devServerPorts vs socket ports.

ive installed and run indie project and edited remix.config.js to set devServerPort according to instructions here

/**

• @type {import('@remix-run/dev').AppConfig}
  /
  module.exports = {
  cacheDirectory: "./node_modules/.cache/remix",
  ignoredRouteFiles: [".", "/*.css", "/*.test.{js,jsx,ts,tsx}"],
  devServerPort: 3301
  };

The default port is 8002 and when I run in the brower i see:

(index):26 WebSocket connection to 'wss://remix1.syntapse.co.uk:8002/socket' failed: 

which appears to imply that devServerPort is being ignored.

There is another issue here

Expected Behavior

1. devServerPort: 3301 should result in the browser attempt to connect to websocket at port 3301 and not the default 8002.
2. there is no way to separate the devServerPort from the devServer socket port though I believe they are not always the same thing.
3. Port specs on reverse proxied connections dont make sense and there is no way to override

'wss://remix1.syntapse.co.uk:8002/socket'

with a client URL similar to:
'wss://remix1.syntapse.co.uk/my-overriden-url-spec-or-nothing-at-all/socket

In previous versions of CRA and Next I have been using formats like this to access socket ports for dev purposes and in most recent versions of each there is no need because the main URL and sockets work off the same port. This I believe would be an optimium solution also for remix to enable a more seamless post-installation developer experience.

Actual Behavior

1. devServerPort: 3301 is being ignored and the default port is being used.
2. the default socket url format is inappropriate for proxied connections and it would advantageous to have some way to remove the port spec from the URL to allow nginx or other proxied router to route based on custom paths. create-react app offers a variety of environment variables to achieve this.

Run migrations on Fly io

Just used this stack for the first time, was really awesome and made building my first Remix app a joy!!

I modified my schema and ran the migration locally, and everything worked. When I pushed to main the GitHub action deployed my code to Fly.io but the migration didn’t run. I saw an error showing my app trying to query a table that didn’t exist.

How can I run migrations on prod? And, is it possible to add this to my GitHub action?

Thanks!

Final docker image contains every file in the repo!

Have you experienced this bug with the latest version of the template?

Yes

Steps to Reproduce

Start a new project.

cp .env.example .env
npm install
docker build -t indie:test .
docker run -it indie:test sh
ls -al

Expected Behavior

Only the absolutely necessary files.

Actual Behavior

All the files in my repository are copied over.

Could not resolve "./styles/tailwind.css"

Have you experienced this bug with the latest version of the template?

Yes

Steps to Reproduce

1. Run "npm run dev"
2. 

Expected Behavior

The app should start without an issue

Actual Behavior

App failed to load

Oops, remix.init failed - no such file or directory, open '/cypress/support/commands.js'

Have you experienced this bug with the latest version of the template?

Yes

Steps to Reproduce

1. run npx create-remix@latest
2. name the app
3. create a pre-configured stack
4. select Indie
5. select TypeScript
6. select Yes to have it npm install.

Windows 10
Node 16.16.0
npm 8.15.1

Expected Behavior

remix.init shouldn't fail

Actual Behavior

Error during validate after initial npx setup

System: Windows 10
Node and Npm: Latest versions

Error:

> test:e2e:run
> cross-env PORT=8811 start-server-and-test start:mocks http://localhost:8811 'cypress run'

C:\Users\Moish\Documents\Github Repos\my-remix-app\node_modules\lazy-ass\index.js:117
      throw err;
      ^

Error: expected <NPM script name that starts server> <url or port> <NPM script name that runs tests>
example: start-test start 8080 test
see https://github.com/bahmutov/start-server-and-test#use

    at lazyAssLogic (C:\Users\Moish\Documents\Github Repos\my-remix-app\node_modules\lazy-ass\index.js:110:14)
    at lazyAss (C:\Users\Moish\Documents\Github Repos\my-remix-app\node_modules\lazy-ass\index.js:115:28)
    at Object.getArguments (C:\Users\Moish\Documents\Github Repos\my-remix-app\node_modules\start-server-and-test\src\utils.js:91:5)
    at Object.<anonymous> (C:\Users\Moish\Documents\Github Repos\my-remix-app\node_modules\start-server-and-test\src\bin\start.js:10:22)
    at Module._compile (node:internal/modules/cjs/loader:1099:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
    at Module.load (node:internal/modules/cjs/loader:975:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:77:12)
    at node:internal/main/run_main_module:17:47

Node.js v17.7.1
ERROR: "test:e2e:run" exited with 1.
🚨 Oops, remix.init failed
Error: Command failed: npm run validate
    at checkExecSyncError (node:child_process:828:11)
    at execSync (node:child_process:899:15)
    at askSetupQuestions (C:\Users\Moish\Documents\Github Repos\my-remix-app\remix.init\index.js:92:5)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async main (C:\Users\Moish\Documents\Github Repos\my-remix-app\remix.init\index.js:68:3)
    at async init (C:\Users\Moish\AppData\Local\npm-cache\_npx\0936179b381f03f9\node_modules\@remix-run\dev\cli\commands.js:112:7)
    at async Object.create (C:\Users\Moish\AppData\Local\npm-cache\_npx\0936179b381f03f9\node_modules\@remix-run\dev\cli\commands.js:82:7)
    at async run (C:\Users\Moish\AppData\Local\npm-cache\_npx\0936179b381f03f9\node_modules\@remix-run\dev\cli.js:324:9) {
  status: 1,
  signal: null,
  output: [ null, null, null ],
  pid: 2624,
  stdout: null,
  stderr: null
}
Error: Command failed: npx --yes @remix-run/[email protected] create --template remix-run/indie-stack
    at checkExecSyncError (node:child_process:828:11)
    at Object.execSync (node:child_process:899:15)
    at run (C:\Users\Moish\AppData\Local\npm-cache\_npx\82f938b29eb562d9\node_modules\create-remix\cli.js:30:17)
    at Object.<anonymous> (C:\Users\Moish\AppData\Local\npm-cache\_npx\82f938b29eb562d9\node_modules\create-remix\cli.js:35:1)
    at Module._compile (node:internal/modules/cjs/loader:1099:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
    at Module.load (node:internal/modules/cjs/loader:975:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:77:12) {
  status: 1,
  signal: null,
  output: [ null, null, null ],
  pid: 9120,
  stdout: null,
  stderr: null
}

Initial setup is fine however at this stage in the setup it errors.

Extended Output:

$ npx create-remix --template remix-run/indie-stack
💿 Welcome to Remix! Let's get you set up with a new project.

? Where would you like to create your app? ./my-remix-app
? Do you want me to run `npm install`? Yes
npm WARN deprecated [email protected]: See https://github.com/lydell/source-map-resolve#deprecated
npm WARN deprecated [email protected]: This package has been deprecated and is no longer maintained. Please use @rollup/plugin-inject.

> postinstall
> remix setup node

Successfully setup Remix for node.

added 1089 packages, and audited 1090 packages in 1m

228 packages are looking for funding
  run `npm fund` for details

4 high severity vulnerabilities

To address all issues (including breaking changes), run:
  npm audit fix --force

Run `npm audit` for details.
💿 Running remix.init script

> setup
> prisma migrate dev

Environment variables loaded from .env
Prisma schema loaded from prisma\schema.prisma
Datasource "db": SQLite database "data.db" at "file:./data.db?connection_limit=1"

SQLite database data.db created at file:./data.db?connection_limit=1

Applying migration `20220307190657_init`

The following migration(s) have been applied:

migrations/
  └─ 20220307190657_init/
    └─ migration.sql

Your database is now in sync with your schema.

✔ Generated Prisma Client (3.11.0 | library) to .\node_modules\@prisma\client in 94ms


Running seed command `node --require esbuild-register prisma/seed.ts` ...
Database has been seeded. 🌱

The seed command has been executed.


? Do you want to run the build/tests/etc to verify things are setup properly? Yes
Running the validate script to make sure everything was set up properly

> validate
> run-p "test -- --run" lint typecheck test:e2e:run


> pretest:e2e:run
> npm run build


> test
> vitest "--run"


> typecheck
> tsc -b && tsc -b cypress


> lint
> eslint --cache --cache-location ./node_modules/.cache/eslint .


> build
> run-s build:*


> build:css
> npm run generate:css -- --minify


 RUN  v0.7.4 C:/Users/Moish/Documents/Github Repos/my-remix-app


> generate:css
> tailwindcss -o ./app/styles/tailwind.css "--minify"


Done in 822ms.

> build:remix
> remix build

Building Remix app in production mode...
 √ app/utils.test.ts (2)

Test Files  1 passed (1)
     Tests  2 passed (2)
      Time  14.39s (in thread 5ms, 316859.42%)

Built in 3s

> test:e2e:run
> cross-env PORT=8811 start-server-and-test start:mocks http://localhost:8811 'cypress run'

C:\Users\Moish\Documents\Github Repos\my-remix-app\node_modules\lazy-ass\index.js:117
      throw err;
      ^

Error: expected <NPM script name that starts server> <url or port> <NPM script name that runs tests>
example: start-test start 8080 test
see https://github.com/bahmutov/start-server-and-test#use

    at lazyAssLogic (C:\Users\Moish\Documents\Github Repos\my-remix-app\node_modules\lazy-ass\index.js:110:14)
    at lazyAss (C:\Users\Moish\Documents\Github Repos\my-remix-app\node_modules\lazy-ass\index.js:115:28)
    at Object.getArguments (C:\Users\Moish\Documents\Github Repos\my-remix-app\node_modules\start-server-and-test\src\utils.js:91:5)
    at Object.<anonymous> (C:\Users\Moish\Documents\Github Repos\my-remix-app\node_modules\start-server-and-test\src\bin\start.js:10:22)
    at Module._compile (node:internal/modules/cjs/loader:1099:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
    at Module.load (node:internal/modules/cjs/loader:975:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:77:12)
    at node:internal/main/run_main_module:17:47

Node.js v17.7.1
ERROR: "test:e2e:run" exited with 1.
🚨 Oops, remix.init failed
Error: Command failed: npm run validate
    at checkExecSyncError (node:child_process:828:11)
    at execSync (node:child_process:899:15)
    at askSetupQuestions (C:\Users\Moish\Documents\Github Repos\my-remix-app\remix.init\index.js:92:5)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async main (C:\Users\Moish\Documents\Github Repos\my-remix-app\remix.init\index.js:68:3)
    at async init (C:\Users\Moish\AppData\Local\npm-cache\_npx\0936179b381f03f9\node_modules\@remix-run\dev\cli\commands.js:112:7)
    at async Object.create (C:\Users\Moish\AppData\Local\npm-cache\_npx\0936179b381f03f9\node_modules\@remix-run\dev\cli\commands.js:82:7)
    at async run (C:\Users\Moish\AppData\Local\npm-cache\_npx\0936179b381f03f9\node_modules\@remix-run\dev\cli.js:324:9) {
  status: 1,
  signal: null,
  output: [ null, null, null ],
  pid: 2624,
  stdout: null,
  stderr: null
}
Error: Command failed: npx --yes @remix-run/[email protected] create --template remix-run/indie-stack
    at checkExecSyncError (node:child_process:828:11)
    at Object.execSync (node:child_process:899:15)
    at run (C:\Users\Moish\AppData\Local\npm-cache\_npx\82f938b29eb562d9\node_modules\create-remix\cli.js:30:17)
    at Object.<anonymous> (C:\Users\Moish\AppData\Local\npm-cache\_npx\82f938b29eb562d9\node_modules\create-remix\cli.js:35:1)
    at Module._compile (node:internal/modules/cjs/loader:1099:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
    at Module.load (node:internal/modules/cjs/loader:975:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:77:12) {
  status: 1,
  signal: null,
  output: [ null, null, null ],
  pid: 9120,
  stdout: null,
  stderr: null
}

error: Environment variable not found: DATABASE_URL

Have you experienced this bug with the latest version of the template?

Yes

Steps to Reproduce

1. Clone this repository or run npx create-remix --template remix-run/indie-stack
2. yarn dev

Expected Behavior

The app should start up without a problem

Actual Behavior

It seems that it can't pick up the environment variables, though when I was using it for a project that I created yesterday it worked fine. The problem seems to have occurred when I used the template for another project today.

It builds the app at first, but when you open http://localhost:3000 on the browser, it throws the following error:

Error: error: Environment variable not found: DATABASE_URL.
  -->  schema.prisma:3
   | 
 2 |   provider = "sqlite"
 3 |   url      = env("DATABASE_URL")
   | 

Validation Error Count: 1
    at Object.loadEngine (C:\Users\Acer\Desktop\Development\remix-projects\streaming-website\node_modules\@prisma\client\runtime\index.js:41175:19)
    at Object.instantiateLibrary (C:\Users\Acer\Desktop\Development\remix-projects\streaming-website\node_modules\@prisma\client\runtime\index.js:41104:5)
    at Object.start (C:\Users\Acer\Desktop\Development\remix-projects\streaming-website\node_modules\@prisma\client\runtime\index.js:41254:5)
fatal error: all goroutines are asleep - deadlock!

Also, thanks for creating this wonderful template and the Remix framework, really loved them

requestIdleCallback not available in Safari

Have you experienced this bug with the latest version of the template?

Yes

Steps to Reproduce

• Start a dev server
• Navigate to it with Safari

Expected Behavior

It should mount React

Actual Behavior

It doesn't mount React, get an error in console:

ReferenceError: Can't find variable: requestIdleCallback

Unfortunately rIC is not supported by Safari, according to caniuse.com. Either its existence should be checked or it should be polyfilled. (Or it can be removed altogether.) I can provide the PR depending on the decision.

Build Failed - buildx failed with: error: failed to solve: unexpected status: 404 Not Found

macOS : --require,./mocks is not allowed in NODE_OPTIONS

Hello there,

Since binode

indie-stack/package.json

Line 13 in bfe5eca

"dev:remix": "binode --require ./mocks -- remix dev",

I have an error when launching npm run dev

macOS 12.3
node v16.14.2

> dev:remix
> binode --require ./mocks -- remix dev

node: --require,./mocks is not allowed in NODE_OPTIONS

Warning: Expected server HTML to contain a matching <script> in <body>.

Upon clean install of the Indie Stack, I get this error message in console every time the page loads. It doesn't break anything as far as I can see, but figure it is worth highlighting.

Warning: Expected server HTML to contain a matching <script> in <body>.
    at script
    at LiveReload2 (http://localhost:3000/build/_shared/chunk-RKTPM4MS.js:3192:3)
    at body
    at html
    at App
    at RemixRoute (http://localhost:3000/build/_shared/chunk-RKTPM4MS.js:2627:3)
    at Routes2 (http://localhost:3000/build/_shared/chunk-RKTPM4MS.js:2610:7)
    at Router (http://localhost:3000/build/_shared/chunk-RKTPM4MS.js:304:15)
    at RemixCatchBoundary (http://localhost:3000/build/_shared/chunk-RKTPM4MS.js:1111:10)
    at RemixErrorBoundary (http://localhost:3000/build/_shared/chunk-RKTPM4MS.js:1036:5)
    at RemixEntry (http://localhost:3000/build/_shared/chunk-RKTPM4MS.js:2507:12)
    at RemixBrowser (http://localhost:3000/build/_shared/chunk-RKTPM4MS.js:3240:27)

Reproduction steps:

1. npx create-remix@latest
2. Name your app. Select Indie Stack when prompted. Hit Y to npm install
3. npm run dev
4. Visit localhost:3000 in browser and open console
5. Error message should be there

If this is not as easily reproducable for anyone else, then perhaps it is an issue with my OS. But I have tried two separate repos (one, I modified the Indie stack app folder with contents of a previous app I am trying to port over to Indie Stack, and the other one was a clean install following steps above.)

Let me know if any other details would make this easier to dig into, or if I am the only one experiencing the issue.