import_jsx_dev_runtime.jsxDEV is not a function after upgrade to 1.7.0 in Docker Container #4081

mattoni · 2022-08-26T23:04:42Z

What version of Remix are you using?

1.7.0

Steps to Reproduce

After upgrading to 1.7.0 and building my docker container, Going to any page yields import_jsx_dev_runtime.jsxDEV is not a function on the server, and an error page is rendered.

Here is my Docker file that causes it to fail:

# Base Node image
FROM node:lts-alpine as base

# Setup all node_modules
FROM base as deps

RUN mkdir /app
WORKDIR /app

ADD package.json ./
ADD yarn.lock ./
RUN yarn install --production=false

# Setup production node_modules
FROM base as production-deps

RUN mkdir /app
WORKDIR /app

COPY --from=deps /app/node_modules /app/node_modules
ADD package*.json ./

# Build the app
FROM base as build

ENV NODE_ENV=production

RUN mkdir /app
WORKDIR /app

COPY --from=deps /app/node_modules /app/node_modules

ADD . .
RUN yarn run build

# Build production image
FROM base

RUN mkdir /app
WORKDIR /app

COPY --from=production-deps /app/node_modules /app/node_modules

COPY --from=build /app/build /app/build
COPY --from=build /app/public /app/public
ADD . .

EXPOSE 3000

CMD ["yarn", "start"]

It is only failing in the container, running the app even with remix-serve works correctly. All package.json dependencies are locked in.

Expected Behavior

The app should work as it did before the upgrade to 1.7.0 (Release notes said no changes to code necessary).

Actual Behavior

The app fails to render any pages.

The text was updated successfully, but these errors were encountered:

jfstn · 2022-08-26T23:10:45Z

I came across this issue today while updating remix.
It seems to be related to the changes introduced in #3860.
For now, I'm keeping @remix/dev on version 1.6.8 and using the other @remix/* dependencies on version 1.7.0

mcansh · 2022-08-26T23:31:57Z

i haven’t seen this in any of my testing thus far, i might be able to take a look tomorrow, but for sure on Monday.

mcansh · 2022-08-27T13:12:56Z

i can't reproduce :(

https://github.com/mcansh/simple-docker-test

you could try nuking node_modules as well as your assetsBuildDirectory and serverBuildPath

mcansh · 2022-08-27T13:19:05Z

~~ok, i did get this, but on 1.6.8 oddly enough~~

edit: oh duh semver ranges 🤦 - i think that may be the root of the issue.

edit 2: actually is this happening just locally or also when you deploy? Make sure you have a .dockerignore so that it doesn't also copy old build files (or node modules), a copy of .gitignore should do.

jfstn · 2022-08-27T14:43:44Z

I was able to do it locally, as in remix build and then remix start. I'll make sure that I'll run a clean build tomorrow or monday.

chrisvariety · 2022-08-28T19:37:12Z

Not sure why, but this reproduces handily on a stock blues stack while running npm run test:e2e:run. Normal npm run dev does not reproduce it.

Repro steps are:

npx create-remix --template remix-run/blues-stack (answer yes to everything, select TypeScript)
npm run docker
npm run setup
npm run build
npm run test:e2e:run

workspace/src/my-remix-app ❯ node --version
v14.18.1
workspace/src/my-remix-app ❯ npm --version
6.14.15

(seems to repro on node v16 as well)

jonschlinkert · 2022-08-28T21:47:01Z

We're getting a similar error with 1.7.0. I haven't looked at the code in 1.7.0 vs 1.6.8 but it seems that RemixServer is exported differently in 1.7.0 than in 1.6.8.

import { RemixServer } from '@remix-run/react';
console.log(RemixServer) //=> undefined

In 1.6.8, RemixServer is a function.

This is the error we're getting:

Remix App Server started at http://localhost:3000 (http://192.168.1.122:3000)
Warning: React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check your code at entry.server.tsx:18.
Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
 ...

FlatMapIO · 2022-08-29T03:23:21Z

We're getting a similar error with 1.7.0. I haven't looked at the code in 1.7.0 vs 1.6.8 but it seems that RemixServer is exported differently in 1.7.0 than in 1.6.8.

import { RemixServer } from '@remix-run/react';
console.log(RemixServer) //=> undefined

In 1.6.8, RemixServer is a function.

This is the error we're getting:

Remix App Server started at http://localhost:3000 (http://192.168.1.122:3000)
Warning: React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check your code at entry.server.tsx:18.
Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
 ...

The cause of the problem has been found: #4080 (comment)

jfstn · 2022-08-30T15:10:05Z

@FlatMapIO the problem does not seem to be precisely the same. I tried all those solutions and they don't seem to work.

chrisvariety · 2022-08-30T15:41:32Z

yep, React.jsx: type is invalid is an entirely different problem, not relevant to this issue.

CanRau · 2022-08-31T21:39:16Z

Hmm weird I'm sure I upgraded couple of days ago and just now ran into this issue 🤨
Also experimenting on another project I briefly ran into it, but resolved it by changing a custom transform stream

Downgrading to 1.6.8 seems to have solved it for now

davidlukerice · 2022-09-01T17:19:52Z

Odd. I also ran into this today when starting up my local dev server for the first time in a few days. Been on 1.7.0 for a while now, though. So not sure what's changed.

Edit:
Got mine running again after doing a full clear of the current modules, re-building the app, then rerunning the local server.
I also went ahead and bumped a number of out of date libraries while I was at it.

rm -rf node_modules/
rm package-lock.json
npm cache clear --force
npm i
npm build
npm start / npm run dev

jfstn · 2022-09-02T09:19:33Z

Just tried a clean build, with a clean package manager and docker cache. The problem is still there for me.

mcansh · 2022-09-02T13:38:46Z

Just tried a clean build, with a clean package manager and docker cache. The problem is still there for me.

is your repo public? or can you try to reproduce on a fresh npx create-remix@1.6.8?

CanRau · 2022-09-02T14:52:42Z

Uh to clarify to me it happened running dev on my machine, so no Docker required 😅

But since last time it didn't happen again 🤷🏻‍♂️

jfstn · 2022-09-02T14:56:46Z

Just tried a clean build, with a clean package manager and docker cache. The problem is still there for me.

is your repo public? or can you try to reproduce on a fresh npx create-remix@1.6.8?

This only happens with remix-run/dev 1.7.0

chrisvariety · 2022-09-02T14:58:46Z

Just tried a clean build, with a clean package manager and docker cache. The problem is still there for me.

is your repo public? or can you try to reproduce on a fresh npx create-remix@1.6.8?

public repo reproduction steps are here #4081 (comment) (as mentioned, doesn't repro on 1.6.8)

dusty · 2022-09-02T21:33:37Z

I'm having a similar problem, getting an error TypeError: (0 , import_react.useFetcher) is not a function\n that I'm seeing in the ErrorBoundary.

However, I am having a really hard time reproducing it on a minimal repro. Also, tried clearing out node_modules, cache, build, etc.. My app works fine on 1.6.8, not on 1.7.0.

yarn dev
node 18.7
macos 12.5.1

wladpaiva · 2022-09-12T19:18:14Z

This is not particular to the @remix-run/dev. I'm experiencing the same issue on my vercel environment as well.

Vercel:

Local:

InTheCloudDan · 2022-09-13T10:48:51Z

I'm getting it when deploying to fly.io. Local dev appears to be working fine, as soon as I deployed it app stopped loading and this is in the logs:

2022-09-13T10:20:03.887 app[2d96f538] ewr [info] at handleRequest (/app/app/entry.server.tsx:23:9)
2022-09-13T10:20:03.887 app[2d96f538] ewr [info] at handleDocumentRequest (/app/node_modules/@remix-run/server-runtime/dist/server.js:409:20)
2022-09-13T10:20:03.887 app[2d96f538] ewr [info] at requestHandler (/app/node_modules/@remix-run/server-runtime/dist/server.js:49:18)
2022-09-13T10:20:03.887 app[2d96f538] ewr [info] at /app/node_modules/@remix-run/express/dist/server.js:39:22

eseyfert · 2022-09-15T14:31:42Z

Ran into the same issue. Runs without issues locally, but then end up seeing the import_jsx_dev_runtime.jsxDEV is not a function error in our Cypress tests GitHub workflows. Reverting to @remix-run/dev@1.6.8 fixed that issue, so something is up.

arnemolland · 2022-09-16T22:30:44Z

This is blocking us from upgrading our production apps as well; runs fine on local machines but the production builds running in containers are all encountering this on >1.7.0. Happens both the default express-based Remix App Server and deno runtimes.

krivaten · 2022-09-23T20:58:14Z

I'm getting it when deploying to fly.io. Local dev appears to be working fine, as soon as I deployed it app stopped loading and this is in the logs:

2022-09-13T10:20:03.887 app[2d96f538] ewr [info] at handleRequest (/app/app/entry.server.tsx:23:9)
2022-09-13T10:20:03.887 app[2d96f538] ewr [info] at handleDocumentRequest (/app/node_modules/@remix-run/server-runtime/dist/server.js:409:20)
2022-09-13T10:20:03.887 app[2d96f538] ewr [info] at requestHandler (/app/node_modules/@remix-run/server-runtime/dist/server.js:49:18)
2022-09-13T10:20:03.887 app[2d96f538] ewr [info] at /app/node_modules/@remix-run/express/dist/server.js:39:22

Same thing here. I'm able to reproduce it running remix-serve build locally as well. Even running npx create-remix@1.6.8 and selecting the bare bones Fly setup, I get the error.

mcansh · 2022-09-23T22:52:09Z

@dusty @wladiston both of your issues are an upstream issue with esbuild (which has since been fixed in 0.15.8) evanw/esbuild#2534 - i'll be looking into upgrading our dependency next week

dusty · 2022-09-24T03:07:04Z

Thanks for the followup @mcansh . We recently tried out 1.7.2 while moving all the keys above spreads and all is well for us.

krivaten · 2022-09-24T13:59:34Z

Thanks @mcansh. Using an npm-shrinkwrap.json I've confirmed that updating esbuild to 0.14.50 resolves the problem.

egorpavlikhin · 2022-09-28T14:14:09Z

Adding remix build before running the app worked for me:

"dev": "remix build && run-p dev:*",
"dev:node": "cross-env NODE_ENV=development nodemon ./server.js --watch ./server.js",
"dev:remix": "npm run clean && npm run partytown && remix watch",

arnemolland · 2022-09-29T19:47:27Z

We managed to fix the issue by forcing esbuild to ^0.15.8 (resolutions field in package.json). Now running remix 1.7.2.

kemicofa · 2022-11-28T22:09:45Z

Seeing the same thing in 1.7.6

Solved by rm -rf build folder and then running the build script again.

lildesert · 2022-12-09T15:56:50Z

Hi!
Do we have an ETA on when this PR will be merged?
My cypress tests run in dev but fail in CI because of this (with NODE_ENV=test).

xargr · 2022-12-10T19:22:12Z

I got the same TypeError: (0 , import_jsx_dev_runtime.jsxDEV) is not a function with version 1.8.2

lanzoninicola · 2022-12-10T19:29:01Z

I don't know if it is helpful, but I experienced the same error and solved it in this mode:

make sure you don't copy the "builds" folders to the container, adding the relevant paths to the .dockerignore file:

build
public/build

also copy the package-lock.json file to ensure that the same versions of the packages used in the development environment are installed. The command in the Dockerfile:

ADD package.json package-lock.json ./

Version:


"@remix-run/react": "^1.8.1",
"@remix-run/serve": "^1.8.1",
"@remix-run/vercel": "^1.8.1",
"@remix-run/dev": "^1.8.1",
"@remix-run/eslint-config": "^1.8.1",

"esbuild": "version": "0.15.12",

mcansh · 2022-12-12T18:31:18Z

same 😞

looks like it built with development mode, remix-serve will force set NODE_ENV=production so import_jsx_dev_runtime.jsxDEV won't exist, instead it would need to be import_jsx_dev_runtime.jsx - i'd check to see if you have a lingering NODE_ENV in your shell setup

brandonpsmith · 2022-12-12T19:14:13Z

i'd check to see if you have a lingering NODE_ENV in your shell setup

Yep. That was my issue. Lingering env. @xargr make sure you do not have NODE_ENV set to development when you run build. Build with NODE_ENV=production then npm start. Thank you @mcansh

maranomynet · 2022-12-22T11:50:47Z

Is there a good reason why remix-serve hard-codes NODE_ENV=production?

production mode sounds like a reasonable default, but would it hurt to allow us to explicitly set it to different values (for whatever reason?)

Asking because I have/had reasons, and then things just stopped working once I upgraded from version 1.6.*

tsdevau · 2023-02-01T00:16:20Z

I'm getting this error now after upgrading to 1.12.0. No docker, this is macos dev env. Upgraded and setup to run new dev env with concurrent TW, remix dev & nodemon:

concurrently \"npm run dev:css\" \"remix dev\" \"nodemon ./server.js\"

Everything builds, but I get this same error of

TypeError: (0 , import_jsx_dev_runtime.jsxDEV) is not a function

Only way I can actually get project to render without error now is to run:

npm run build
npm run start

This at least allows me to still view the project.

I've tried

removing build/**/*, public/build/**/*, .cache/**/* and rebuilding.
removing package-lock.json and running npm i -f
removing node_modules/**/* && package-lock.json and running npm i
All of the above with <LiveReload /> in root.tsx && the same commented out

The error still occurs. Essentially I can no longer use npm run dev, I need to build and start to view project.

cjbland · 2023-02-18T14:30:12Z

For what it's worth, I'm using 1.13.0 and I ran into this issue when I was explicitly setting NODE_ENV to something other than "production". Specifically running something like this: NODE_ENV="development" npm run build && npm run start. The console looks like this for me:

$> NODE_ENV="development" npm run build

> build
> npm run build:css && remix build


> build:css
> tailwindcss -o ./app/tailwind.css


Rebuilding...

Done in 340ms.
Building Remix app in development mode...
Built in 671ms
$> npm start
Remix App Server started at http://localhost:3000 (http://192.168.3.60:3000)
TypeError: (0 , import_jsx_dev_runtime.jsxDEV) is not a function
    at handleRequest (/myproject/build/index.js:50:55)
    at handleDocumentRequestRR (/myproject/node_modules/@remix-run/server-runtime/dist/server.js:229:20)
    at requestHandler (/myproject/node_modules/@remix-run/server-runtime/dist/server.js:67:18)
    at /myproject/node_modules/@remix-run/express/dist/server.js:39:22
GET / 500 - - 23.433 ms

Changing "development" to "production" and everything works as expected.

qianjiachun · 2023-02-21T04:17:54Z

remix 1.9.0
no docker
Debian GNU/Linux 11 x86_64

I may encounter this problem accidentally. Here is my solution (temporary)

Upload the entire source code directory to the server, except for 'build', 'public' and 'node_ modules`
npm i
npm run build
npm run start
Delete the source code, leaving only build public package. json package-lock. json
Upload the compiled file again in the future, and the webpage will not report errors again

My other servers have never had such problems (upload the build file can run), but this server can't.
I don't know why. It works anyway.😂

here is my package.json

{
  "private": true,
  "sideEffects": false,
  "scripts": {
    "build": "run-s build:*",
    "build:css": "npm run generate:css -- --minify",
    "build:remix": "remix build",
    "dev": "run-p dev:*",
    "dev:css": "npm run generate:css -- --watch",
    "dev:remix": "remix dev",
    "generate:css": "npx tailwindcss -i ./styles/tailwind.css -o ./app/styles/tailwind.css",
    "dev:sass": "sass --no-source-map --style compressed --watch styles/:app/styles/",
    "build:sass": "sass --no-source-map --style compressed styles/:app/styles/",
    "start": "export PORT=7003 && remix-serve build",
    "lint:eslint": "eslint --cache --max-warnings 0 \"app/**/*.{vue,js,ts,tsx}\" --fix",
    "lint:prettier": "prettier --write  \"app/**/*.{js,ts,json,tsx,css,less,scss,vue,html,md}\"",
    "lint": "npm run lint:eslint && npm run lint:prettier",
    "postinstall": "patch-package"
  },
  "dependencies": {
    "@ant-design/icons": "^4.8.0",
    "@remix-run/node": "^1.9.0",
    "@remix-run/react": "^1.9.0",
    "@remix-run/serve": "^1.9.0",
    "@types/nprogress": "^0.2.0",
    "@typescript-eslint/eslint-plugin": "^5.47.0",
    "@typescript-eslint/parser": "^5.47.0",
    "@uiw/react-watermark": "^0.0.5",
    "antd": "^4.24.3",
    "await-to-js": "^3.0.0",
    "axios": "^1.2.1",
    "browserlist": "^1.0.1",
    "clsx": "^1.2.1",
    "copy-to-clipboard": "^3.3.3",
    "dayjs": "^1.11.7",
    "echarts-stat": "^1.2.0",
    "eslint-config-prettier": "^8.5.0",
    "eslint-plugin-prettier": "^4.2.1",
    "eslint-plugin-react": "^7.31.11",
    "immer": "^9.0.16",
    "npm-check": "^6.0.1",
    "nprogress": "^0.2.0",
    "prettier": "^2.8.1",
    "pure-md5": "^0.1.14",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-google-recaptcha-v3": "^1.10.1",
    "ulid": "^2.3.0",
    "use-immer": "^0.8.1"
  },
  "devDependencies": {
    "@remix-run/dev": "^1.9.0",
    "@remix-run/eslint-config": "^1.9.0",
    "@types/react": "^18.0.26",
    "@types/react-dom": "^18.0.9",
    "concurrently": "^7.6.0",
    "eslint": "^8.30.0",
    "npm-run-all": "^4.1.5",
    "patch-package": "^6.5.0",
    "sass": "^1.57.1",
    "tailwindcss": "^3.2.4",
    "typescript": "^4.9.4"
  },
  "engines": {
    "node": ">=14"
  }
}

eran-or · 2023-02-23T09:42:26Z

For me this issue happened after uninstall some packages.
npm install then npm run dev fixed the issue.

cjoecker · 2023-03-01T18:21:27Z

It was happening in my case because I had the wrong value in the NODE_ENV env variable. The value should be development and production when deployed. I had it in capital letters and that's why it was breaking the app.

kyeotic · 2023-03-18T00:29:49Z

I'm running into this as well, but can recreate it without docker as long as I run with ``NODE_ENV=production node server.js`.

However, if I build with NODE_ENV=production and run without that flag I don't hit the jsxDEV is not a function error. The page renders, and then throws this LiveReload error (which makes sense, it thinks we are in dev)

Warning: Expected server HTML to contain a matching <script> in <body>.
script
LiveReload2@http://localhost:3000/build/_shared/chunk-ZVKXYPQ3.js:7712:59
body
html
Root
RemixRoute@http://localhost:3000/build/_shared/chunk-ZVKXYPQ3.js:6987:20
RenderedRoute@http://localhost:3000/build/_shared/chunk-ZVKXYPQ3.js:4475:7
RenderErrorBoundary@http://localhost:3000/build/_shared/chunk-ZVKXYPQ3.js:4831:9
Routes@http://localhost:3000/build/_shared/chunk-ZVKXYPQ3.js:4706:7
Router@http://localhost:3000/build/_shared/chunk-ZVKXYPQ3.js:4657:7
RouterProvider@http://localhost:3000/build/_shared/chunk-ZVKXYPQ3.js:4604:7
RemixErrorBoundary@http://localhost:3000/build/_shared/chunk-ZVKXYPQ3.js:6604:5
RemixBrowser@http://localhost:3000/build/_shared/chunk-ZVKXYPQ3.js:8147:55

Either way, it seems building for production is still broken. Seems like the PR fix has stalled.

VerioN1 · 2023-03-20T07:57:35Z

I am using the latest remix (1.14.3) on docker.
same error thrown when I run the Image, and I didn't change the NODE_ENV from 'production' .

lukaszdz · 2023-03-29T21:50:02Z

I'm getting the same error when I deploy it to fly.io and visit the deployed app. Happens on a fresh remix install and deploy of this PWA remix stack - https://github.com/ShafSpecs/rockspec-stack

I'm not sure if this is related, but I'm getting the same error when I deploy it to fly.io. Happens on a fresh install and fresh deploy of this PWA remix stack - https://github.com/ShafSpecs/rockspec-stack

$ fly logs -a my-app-staging

Waiting for logs...

2023-03-29T21:12:49.233 runner[8a81e785] sjc [info] Starting instance
2023-03-29T21:12:49.354 runner[8a81e785] sjc [info] Configuring virtual machine
2023-03-29T21:12:49.356 runner[8a81e785] sjc [info] Pulling container image
2023-03-29T21:12:54.625 runner[8a81e785] sjc [info] Unpacking image
2023-03-29T21:13:01.167 runner[8a81e785] sjc [info] Preparing kernel init
2023-03-29T21:13:01.545 runner[8a81e785] sjc [info] Configuring firecracker
2023-03-29T21:13:02.342 runner[8a81e785] sjc [info] Starting virtual machine
2023-03-29T21:13:02.655 app[8a81e785] sjc [info] Starting init (commit: 8e03fa6)...
2023-03-29T21:13:02.680 app[8a81e785] sjc [info] Preparing to run: `docker-entrypoint.sh npm run start` as root
2023-03-29T21:13:02.706 app[8a81e785] sjc [info] 2023/03/29 21:13:02 listening on [fdaa:0:44ae:a7b:b2e2:8a81:e785:2]:22 (DNS: [fdaa::3]:53)
2023-03-29T21:13:03.453 app[8a81e785] sjc [info] > start
2023-03-29T21:13:03.453 app[8a81e785] sjc [info] > remix-serve build
2023-03-29T21:13:04.297 health[8a81e785] sjc [warn] Health check on port 8080 is in a 'warning' state. Your app may not be responding properly. Services exposed on ports [80, 443] may have intermittent failures until the health check passes.
2023-03-29T21:13:04.424 app[8a81e785] sjc [info] Remix App Server started at http://localhost:8080 (http://172.19.70.138:8080)
2023-03-29T21:13:10.060 health[8a81e785] sjc [info] Health check on port 8080 is now passing.
2023-03-29T21:23:54.660 app[8a81e785] sjc [info] TypeError: (0 , import_jsx_dev_runtime.jsxDEV) is not a function
2023-03-29T21:23:54.660 app[8a81e785] sjc [info] at handleRequest (/app/app/entry.server.tsx:13:5)
2023-03-29T21:23:54.660 app[8a81e785] sjc [info] at handleDocumentRequestRR (/app/node_modules/@remix-run/server-runtime/dist/server.js:229:20)
2023-03-29T21:23:54.660 app[8a81e785] sjc [info] at requestHandler (/app/node_modules/@remix-run/server-runtime/dist/server.js:67:18)
2023-03-29T21:23:54.660 app[8a81e785] sjc [info] at /app/node_modules/@remix-run/express/dist/server.js:39:22
2023-03-29T21:23:54.667 app[8a81e785] sjc [info] GET / 500 - - 69.908 ms
2023-03-29T21:23:58.762 app[8a81e785] sjc [info] TypeError: (0 , import_jsx_dev_runtime.jsxDEV) is not a function
2023-03-29T21:23:58.762 app[8a81e785] sjc [info] at handleRequest (/app/app/entry.server.tsx:13:5)
2023-03-29T21:23:58.762 app[8a81e785] sjc [info] at handleDocumentRequestRR (/app/node_modules/@remix-run/server-runtime/dist/server.js:229:20)
2023-03-29T21:23:58.762 app[8a81e785] sjc [info] at requestHandler (/app/node_modules/@remix-run/server-runtime/dist/server.js:67:18)
2023-03-29T21:23:58.762 app[8a81e785] sjc [info] at /app/node_modules/@remix-run/express/dist/server.js:39:22
2023-03-29T21:23:58.763 app[8a81e785] sjc [info] GET / 500 - - 4.490 ms

mcansh · 2023-03-30T14:17:32Z

I'm getting the same error when I deploy it to fly.io and visit the deployed app. Happens on a fresh remix install and deploy of this PWA remix stack - https://github.com/ShafSpecs/rockspec-stack

@lukaszdz i noticed you have a .dockerignore with just node_modules, can you try adding build and public/build to that? in theory running npm run build should alleviate that, but perhaps not

VerioN1 · 2023-04-01T12:36:38Z

I'm getting the same error when I deploy it to fly.io and visit the deployed app. Happens on a fresh remix install and deploy of this PWA remix stack - https://github.com/ShafSpecs/rockspec-stack

@lukaszdz i noticed you have a .dockerignore with just node_modules, can you try adding build and public/build to that? in theory running npm run build should alleviate that, but perhaps not

helped to fix !

`NODE_ENV=production` is required due remix issue remix-run/remix#4081 Once that issue is solved, we should be able to remove the NODE_ENV setting from here.

jjenzz · 2023-05-27T20:30:39Z

this happens out-of-the box with the following steps:

run npx create-remix@latest (1.16.1 at time of writing)
choose Just the basics
choose Netlify
choose Typescript
choose "yes" to install npm deps
run nvm use 16
open project and run NODE_ENV=production npm run build
run npm run start

opening browser shows the following:

server log

TypeError: (0 , import_jsx_dev_runtime.jsxDEV) is not a function
  at /Users/jenna/Development/remix-netlify/app/entry.server.tsx:89:7
  at new Promise (<anonymous>)
  at handleBrowserRequest (/Users/jenna/Development/remix-netlify/app/entry.server.tsx:87:10)
  at handleRequest (/Users/jenna/Development/remix-netlify/app/entry.server.tsx:31:7)
  at handleDocumentRequestRR (/Users/jenna/Development/remix-netlify/node_modules/@remix-run/server-runtime/dist/server.js:215:20)
  at processTicksAndRejections (node:internal/process/task_queues:95:5)
  at requestHandler (/Users/jenna/Development/remix-netlify/node_modules/@remix-run/server-runtime/dist/server.js:49:18)
  at Object.<anonymous> (/Users/jenna/Development/remix-netlify/node_modules/@remix-run/netlify/dist/server.js:35:20)
Response with status 500 in 5 ms.

inssein · 2023-06-19T21:30:58Z

This is a pretty real problem. I created a brand new remix app, just the basics, served by Remix App Server and using typescript.

remix run start doesn't even work without first running npm run dev, and the second run I get the error described in this thread.

Edit: Looks like I missed some instructions to run npm run build first, my bad.

b-goldney · 2023-07-26T22:21:45Z

I was able to fix this issue by changing the node version to >16 in package.json.

  "engines": {
    "node": ">=16"
  }

MichaelDeBoey · 2023-08-06T16:30:25Z

#6964 solves this from happening

yehudamakarov · 2023-08-17T00:00:14Z

Hey all, I'm just trying to dockerize a new remix project and running into this exact issue.

I've read everything briefly, but what must I do to dockerize my remix app?

Is the only option to downgrade everything to 1.6.8/1.7?

# base node image
FROM node:16-bullseye-slim as base

# Install all node_modules, including dev dependencies
FROM base as deps

RUN mkdir /app
WORKDIR /app

ADD package.json package-lock.json ./

RUN npm install --production=false

# Setup production node_modules
FROM base as production-deps

ENV NODE_ENV production

RUN mkdir /app
WORKDIR /app

COPY --from=deps /app/node_modules /app/node_modules
ADD package.json package-lock.json ./
RUN npm prune --production

# Build the app
FROM base as build

RUN mkdir /app
WORKDIR /app

COPY --from=deps /app/node_modules /app/node_modules

ADD . .
RUN npm run build

# Finally, build the production image with minimal footprint
FROM base

ENV NODE_ENV production

RUN mkdir /app
WORKDIR /app

COPY --from=production-deps /app/node_modules /app/node_modules
COPY --from=build /app/build /app/build
COPY --from=build /app/public /app/public
ADD . .

EXPOSE 3000
CMD ["npm", "run", "start"]

    "@remix-run/node": "^1.19.1",
    "@remix-run/react": "^1.19.1",
    "@remix-run/serve": "^1.19.1",
    "@remix-run/server-runtime": "^1.19.1",
    "remix": "^1.19.1",
    "@remix-run/dev": "^1.19.1",

mcansh · 2023-08-17T00:14:14Z

@yehudamakarov is this locally or on some CI? if locally, try adding public/build, build, and .cache to your .dockerignore

yehudamakarov · 2023-08-17T02:09:24Z

that worked, (will read the thread more carefully as to why)
@mcansh as of now i'm just testing my container locally, but soon I'll probably set up CI
let's say I use CI?

mattoni added the bug:unverified label Aug 26, 2022

machour assigned mcansh Aug 27, 2022

This comment was marked as duplicate.

Sign in to view

gmpify mentioned this issue Apr 28, 2023

Make package.json compatible with buildpack Shopify/shopify-app-template-remix#12

Merged

brophdawg11 added the package:dev label May 5, 2023

brophdawg11 assigned pcattori Aug 3, 2023

MichaelDeBoey closed this as completed Aug 6, 2023

import_jsx_dev_runtime.jsxDEV is not a function after upgrade to 1.7.0 in Docker Container #4081

import_jsx_dev_runtime.jsxDEV is not a function after upgrade to 1.7.0 in Docker Container #4081

Comments

mattoni commented Aug 26, 2022

What version of Remix are you using?

Steps to Reproduce

Expected Behavior

Actual Behavior

jfstn commented Aug 26, 2022

mcansh commented Aug 26, 2022

mcansh commented Aug 27, 2022 • edited Loading

mcansh commented Aug 27, 2022 • edited Loading

jfstn commented Aug 27, 2022

chrisvariety commented Aug 28, 2022 • edited Loading

jonschlinkert commented Aug 28, 2022

FlatMapIO commented Aug 29, 2022

jfstn commented Aug 30, 2022

chrisvariety commented Aug 30, 2022

CanRau commented Aug 31, 2022

davidlukerice commented Sep 1, 2022 • edited Loading

jfstn commented Sep 2, 2022

mcansh commented Sep 2, 2022

CanRau commented Sep 2, 2022

jfstn commented Sep 2, 2022

chrisvariety commented Sep 2, 2022

dusty commented Sep 2, 2022 • edited Loading

wladpaiva commented Sep 12, 2022

InTheCloudDan commented Sep 13, 2022

eseyfert commented Sep 15, 2022

arnemolland commented Sep 16, 2022

krivaten commented Sep 23, 2022 • edited Loading

mcansh commented Sep 23, 2022 • edited Loading

dusty commented Sep 24, 2022

krivaten commented Sep 24, 2022

egorpavlikhin commented Sep 28, 2022

arnemolland commented Sep 29, 2022

kemicofa commented Nov 28, 2022 • edited Loading

lildesert commented Dec 9, 2022

xargr commented Dec 10, 2022

lanzoninicola commented Dec 10, 2022 • edited Loading

This comment was marked as duplicate.

mcansh commented Dec 12, 2022 • edited Loading

brandonpsmith commented Dec 12, 2022

maranomynet commented Dec 22, 2022

tsdevau commented Feb 1, 2023 • edited Loading

cjbland commented Feb 18, 2023

qianjiachun commented Feb 21, 2023

eran-or commented Feb 23, 2023 • edited Loading

cjoecker commented Mar 1, 2023

kyeotic commented Mar 18, 2023 • edited Loading

VerioN1 commented Mar 20, 2023 • edited Loading

lukaszdz commented Mar 29, 2023

mcansh commented Mar 30, 2023

VerioN1 commented Apr 1, 2023

jjenzz commented May 27, 2023 • edited Loading

inssein commented Jun 19, 2023 • edited Loading

b-goldney commented Jul 26, 2023 • edited Loading

MichaelDeBoey commented Aug 6, 2023

yehudamakarov commented Aug 17, 2023

mcansh commented Aug 17, 2023

yehudamakarov commented Aug 17, 2023 • edited Loading

mcansh commented Aug 27, 2022 •

edited

Loading

mcansh commented Aug 27, 2022 •

edited

Loading

chrisvariety commented Aug 28, 2022 •

edited

Loading

davidlukerice commented Sep 1, 2022 •

edited

Loading

dusty commented Sep 2, 2022 •

edited

Loading

krivaten commented Sep 23, 2022 •

edited

Loading

mcansh commented Sep 23, 2022 •

edited

Loading

kemicofa commented Nov 28, 2022 •

edited

Loading

lanzoninicola commented Dec 10, 2022 •

edited

Loading

mcansh commented Dec 12, 2022 •

edited

Loading

tsdevau commented Feb 1, 2023 •

edited

Loading

eran-or commented Feb 23, 2023 •

edited

Loading

kyeotic commented Mar 18, 2023 •

edited

Loading

VerioN1 commented Mar 20, 2023 •

edited

Loading

jjenzz commented May 27, 2023 •

edited

Loading

inssein commented Jun 19, 2023 •

edited

Loading

b-goldney commented Jul 26, 2023 •

edited

Loading

yehudamakarov commented Aug 17, 2023 •

edited

Loading