Railway•15mo ago

Cant deploy my Shopify App

Hey, i use docker for my deployment, everytime i want to deploy i get following message:

#9 4.936 ✘ [ERROR] Could not resolve "uglify-js"

#9 4.936

#9 4.936     node_modules/terser-webpack-plugin/dist/utils.js:409:14:

#9 4.936       409 │   } = require("uglify-js");

#9 4.936           ╵               ~~~~~~~~~~~

#9 4.936

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

#9 4.936

#9 4.936

#9 4.936 ✘ [ERROR] Could not resolve "@swc/core"

#9 4.936

#9 4.936     node_modules/terser-webpack-plugin/dist/utils.js:487:22:

 

#9 4.936       487 │   const swc = require("@swc/core");

#9 4.936           ╵                       ~~~~~~~~~~~

#9 4.936

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

#9 4.936

#9 4.936

#9 4.936 ✘ [ERROR] Could not resolve "uglify-js"

#9 4.936

#9 4.936     node_modules/terser-webpack-plugin/dist/utils.js:409:14:

#9 4.936       409 │   } = require("uglify-js");

#9 4.936           ╵               ~~~~~~~~~~~

#9 4.936

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

#9 4.936

#9 4.936

#9 4.936 ✘ [ERROR] Could not resolve "@swc/core"

#9 4.936

#9 4.936     node_modules/terser-webpack-plugin/dist/utils.js:487:22:

 

#9 4.936       487 │   const swc = require("@swc/core");

#9 4.936           ╵                       ~~~~~~~~~~~

#9 4.936

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

#9 4.936

#9 4.936

could you help me to solve that? Terser is a peer dep from another package so no way i can change something there 😄 Under the hood is running: Remix

Solution:

@Brody import { node } from "webpack"; ...

Jump to solution

42 Replies

Percy•15mo ago

Project ID: ce392965-b44b-4e2b-84ec-6cc17305fc2c

BaldbytesOP•15mo ago

ce392965-b44b-4e2b-84ec-6cc17305fc2c

Brody•15mo ago

add uglify-js to your dev deps?

BaldbytesOP•15mo ago

causes more errors from other packages swc/wasm is then missing. but yeah, i will give it a try to extend it

Brody•15mo ago

do you get this error during a local build?

BaldbytesOP•15mo ago

nope

Brody•15mo ago

what version of node do you use locally

BaldbytesOP•15mo ago

20 same as in my docker and package json file added now all the deps and this is the new deploy output:

#9 7.922 ✘ [ERROR] Node builtin "util" (imported by "node_modules/webpack/lib/index.js") must be polyfilled for the browser. You can enable this polyfill in your Remix config, e.g. `browserNodeBuiltinsPolyfill: { modules: { util: true } }` [plugin browser-node-builtins-polyfill-plugin]

#9 7.922

#9 7.922

#9 7.922 ✘ [ERROR] Node builtin "crypto" (imported by "node_modules/webpack/lib/util/createHash.js") must be polyfilled for the browser. You can enable this polyfill in your Remix config, e.g. `browserNodeBuiltinsPolyfill: { modules: { crypto: true } }` [plugin browser-node-builtins-polyfill-plugin]

#9 7.922

#9 7.922

 

#9 7.922 ✘ [ERROR] Node builtin "path" (imported by "node_modules/webpack/lib/cli.js") must be polyfilled for the browser. You can enable this polyfill in your Remix config, e.g. `browserNodeBuiltinsPolyfill: { modules: { path: true } }` [plugin browser-node-builtins-polyfill-plugin]

#9 7.922

#9 7.922

#9 7.922 ✘ [ERROR] Node builtin "fs" (imported by "node_modules/webpack/lib/config/defaults.js") must be polyfilled for the browser. You can enable this polyfill in your Remix config, e.g. `browserNodeBuiltinsPolyfill: { modules: { fs: true } }` [plugin browser-node-builtins-polyfill-plugin]

#9 7.922 ✘ [ERROR] Node builtin "util" (imported by "node_modules/webpack/lib/index.js") must be polyfilled for the browser. You can enable this polyfill in your Remix config, e.g. `browserNodeBuiltinsPolyfill: { modules: { util: true } }` [plugin browser-node-builtins-polyfill-plugin]

#9 7.922

#9 7.922

#9 7.922 ✘ [ERROR] Node builtin "crypto" (imported by "node_modules/webpack/lib/util/createHash.js") must be polyfilled for the browser. You can enable this polyfill in your Remix config, e.g. `browserNodeBuiltinsPolyfill: { modules: { crypto: true } }` [plugin browser-node-builtins-polyfill-plugin]

#9 7.922

#9 7.922

 

#9 7.922 ✘ [ERROR] Node builtin "path" (imported by "node_modules/webpack/lib/cli.js") must be polyfilled for the browser. You can enable this polyfill in your Remix config, e.g. `browserNodeBuiltinsPolyfill: { modules: { path: true } }` [plugin browser-node-builtins-polyfill-plugin]

#9 7.922

#9 7.922

#9 7.922 ✘ [ERROR] Node builtin "fs" (imported by "node_modules/webpack/lib/config/defaults.js") must be polyfilled for the browser. You can enable this polyfill in your Remix config, e.g. `browserNodeBuiltinsPolyfill: { modules: { fs: true } }` [plugin browser-node-builtins-polyfill-plugin]

the list goes on and on and on

Brody•15mo ago

are you using a dockerfile?

BaldbytesOP•15mo ago

yes

Brody•15mo ago

send it please

BaldbytesOP•15mo ago

FROM node:20

EXPOSE 3000
WORKDIR /app
COPY . .

RUN yarn install
RUN yarn build

# You'll probably want to remove this in production, it's here to make it easier to test things!
RUN rm -f prisma/dev.sqlite

CMD ["yarn", "docker-start"]

FROM node:20

EXPOSE 3000
WORKDIR /app
COPY . .

RUN yarn install
RUN yarn build

# You'll probably want to remove this in production, it's here to make it easier to test things!
RUN rm -f prisma/dev.sqlite

CMD ["yarn", "docker-start"]

Brody•15mo ago

and you build with docker locally?

BaldbytesOP•15mo ago

{
  "name": "mix-and-matchify",
  "private": true,
  "scripts": {
    "build-js": "webpack",
    "watch-js": "nodemon --watch .src --ext js,scss --exec 'npm run build-js'",
    "build": "NODE_ENV=production remix build",
    "predev": "prisma generate && prisma migrate deploy",
    "dev": "npm run watch-js && shopify app dev",
    "config:link": "shopify app config link",
    "config:push": "shopify app config push",
    "generate": "shopify app generate",
    "deploy": "npm run build-js && shopify app deploy",
    "config:use": "shopify app config use",
    "env": "shopify app env",
    "start": "remix-serve build",
    "docker-start": "npm run setup && npm run start",
    "setup": "prisma generate && prisma migrate deploy",
    "lint": "eslint --cache --cache-location ./node_modules/.cache/eslint .",
    "shopify": "shopify",
    "prisma": "prisma"
  },
  deps...
  "engines": {
    "node": "20"
  },
  "workspaces": [
    "web",
    "web/frontend",
    "extensions/*"
  ],
  "author": "muffin"
}

{
  "name": "mix-and-matchify",
  "private": true,
  "scripts": {
    "build-js": "webpack",
    "watch-js": "nodemon --watch .src --ext js,scss --exec 'npm run build-js'",
    "build": "NODE_ENV=production remix build",
    "predev": "prisma generate && prisma migrate deploy",
    "dev": "npm run watch-js && shopify app dev",
    "config:link": "shopify app config link",
    "config:push": "shopify app config push",
    "generate": "shopify app generate",
    "deploy": "npm run build-js && shopify app deploy",
    "config:use": "shopify app config use",
    "env": "shopify app env",
    "start": "remix-serve build",
    "docker-start": "npm run setup && npm run start",
    "setup": "prisma generate && prisma migrate deploy",
    "lint": "eslint --cache --cache-location ./node_modules/.cache/eslint .",
    "shopify": "shopify",
    "prisma": "prisma"
  },
  deps...
  "engines": {
    "node": "20"
  },
  "workspaces": [
    "web",
    "web/frontend",
    "extensions/*"
  ],
  "author": "muffin"
}

nope, locally i use the dev command i dont see really the problem here :/

Brody•15mo ago

i dont either, so lets just try things

BaldbytesOP•15mo ago

because the same dockerfile and deploy works on heroku

Brody•15mo ago

since you dont use docker locally, so you wanna give railway's nixpacks a try?

BaldbytesOP•15mo ago

if it isnt a hassel to setup

Brody•15mo ago

this would involve setting the start command in the service settings to yarn docker-start and just removing or renaming the Dockerfile from your project folder

BaldbytesOP•15mo ago

wait gimme a second, had that before, i do a roll back to a previous repo state

Brody•15mo ago

sounds good

BaldbytesOP•15mo ago

have to recreate the yarn.lock hold the line 😄

Brody•15mo ago

ah yeah thats true assumed you had one, mb

BaldbytesOP•15mo ago

yeah but it differs now just want to get sure to have the right versions in it but also the same result here

#12 4.395 ✘ [ERROR] Could not resolve "uglify-js"

#12 4.395

#12 4.395     node_modules/terser-webpack-plugin/dist/utils.js:409:14:

#12 4.395       409 │   } = require("uglify-js");

#12 4.395           ╵               ~~~~~~~~~~~

#12 4.395

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

#12 4.395

#12 4.395

#12 4.395 ✘ [ERROR] Could not resolve "@swc/core"

#12 4.395

#12 4.395     node_modules/terser-webpack-plugin/dist/utils.js:487:22:

#12 4.395       487 │   const swc = require("@swc/core");

#12 4.395           ╵                       ~~~~~~~~~~~

#12 4.395

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

#12 4.395 ✘ [ERROR] Could not resolve "uglify-js"

#12 4.395

#12 4.395     node_modules/terser-webpack-plugin/dist/utils.js:409:14:

#12 4.395       409 │   } = require("uglify-js");

#12 4.395           ╵               ~~~~~~~~~~~

#12 4.395

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

#12 4.395

#12 4.395

#12 4.395 ✘ [ERROR] Could not resolve "@swc/core"

#12 4.395

#12 4.395     node_modules/terser-webpack-plugin/dist/utils.js:487:22:

#12 4.395       487 │   const swc = require("@swc/core");

#12 4.395           ╵                       ~~~~~~~~~~~

#12 4.395

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

Brody•15mo ago

its now using nixpacks?

BaldbytesOP•15mo ago

yes maybe this has to do with my remix config? all my files will be served as cjs instead of esm "the new cool feature of remix"

// eslint-disable-next-line no-warning-comments
// TODO: Document this properly somewhere. Where? We should discuss this issue with the CLI team.
// Related: https://github.com/remix-run/remix/issues/2835#issuecomment-1144102176
// Replace the HOST env var with SHOPIFY_APP_URL so that it doesn't break the remix server. The CLI will eventually
// stop passing in HOST, so we can remove this workaround after the next major release.
if (
  process.env.HOST &&
  (!process.env.SHOPIFY_APP_URL ||
    process.env.SHOPIFY_APP_URL === process.env.HOST)
) {
  process.env.SHOPIFY_APP_URL = process.env.HOST;
  delete process.env.HOST;
}

/** @type {import('@remix-run/dev').AppConfig} */
module.exports = {
  ignoredRouteFiles: ["**/.*"],
  appDirectory: "app",
  serverModuleFormat: "cjs",
  tailwind: true,
  errorBoundary: true,
  headers: true,
  meta: true,
  normalizeFormMethod: true,
  routeConvention: true,
  serverDependenciesToBundle: [
    /remix-utils/
  ],
  dev: {
    port: process.env.HMR_SERVER_PORT || 8002,
  },
};

// eslint-disable-next-line no-warning-comments
// TODO: Document this properly somewhere. Where? We should discuss this issue with the CLI team.
// Related: https://github.com/remix-run/remix/issues/2835#issuecomment-1144102176
// Replace the HOST env var with SHOPIFY_APP_URL so that it doesn't break the remix server. The CLI will eventually
// stop passing in HOST, so we can remove this workaround after the next major release.
if (
  process.env.HOST &&
  (!process.env.SHOPIFY_APP_URL ||
    process.env.SHOPIFY_APP_URL === process.env.HOST)
) {
  process.env.SHOPIFY_APP_URL = process.env.HOST;
  delete process.env.HOST;
}

/** @type {import('@remix-run/dev').AppConfig} */
module.exports = {
  ignoredRouteFiles: ["**/.*"],
  appDirectory: "app",
  serverModuleFormat: "cjs",
  tailwind: true,
  errorBoundary: true,
  headers: true,
  meta: true,
  normalizeFormMethod: true,
  routeConvention: true,
  serverDependenciesToBundle: [
    /remix-utils/
  ],
  dev: {
    port: process.env.HMR_SERVER_PORT || 8002,
  },
};

and also have a ts config

{
  "include": ["**/*.js", "**/*.jsx"],
  "compilerOptions": {
    "lib": ["DOM", "DOM.Iterable", "ES2019"],
    "isolatedModules": true,
    "esModuleInterop": true,
    "jsx": "react-jsx",
    "moduleResolution": "node16",
    "resolveJsonModule": true,
    "target": "ES2019",
    "strict": true,
    "allowJs": true,
    "checkJs": true,
    "noImplicitAny": false,
    "forceConsistentCasingInFileNames": true,
    "baseUrl": ".",
    "paths": {
      "~/*": ["./app/*"]
    },
    "types": [
      "@shopify/app-bridge-types"
    ],
    "noEmit": true
  }
}

{
  "include": ["**/*.js", "**/*.jsx"],
  "compilerOptions": {
    "lib": ["DOM", "DOM.Iterable", "ES2019"],
    "isolatedModules": true,
    "esModuleInterop": true,
    "jsx": "react-jsx",
    "moduleResolution": "node16",
    "resolveJsonModule": true,
    "target": "ES2019",
    "strict": true,
    "allowJs": true,
    "checkJs": true,
    "noImplicitAny": false,
    "forceConsistentCasingInFileNames": true,
    "baseUrl": ".",
    "paths": {
      "~/*": ["./app/*"]
    },
    "types": [
      "@shopify/app-bridge-types"
    ],
    "noEmit": true
  }
}

this is based on node16 for resolution

Brody•15mo ago

it all looks fine to me, maybe do some research about this issue since i cant see this being isolated to railway only, and if you find anything id be happy to help you implement it on railway

BaldbytesOP•15mo ago

thank you for your time Brody

Brody•15mo ago

sorry I couldn't be of more help, I'm not a js dev lol

BaldbytesOP•15mo ago

it helped alot the error also happend locally if i use the build command so from there i can further debug.

Brody•15mo ago

ah that makes it easier then

Solution

Baldbytes•15mo ago

@Brody import { node } from "webpack"; ...

Brody•15mo ago

huh

BaldbytesOP•15mo ago

https://tenor.com/view/stewie-family-guy-therapy-its-okay-im-fine-gif-20320952

Tenor

BaldbytesOP•15mo ago

this caused the build to crash this line shouldnt be there, now everything works just a charm

Brody•15mo ago

this is why im not a js dev 🤣

BaldbytesOP•15mo ago

teach me python

Brody•15mo ago

thats not any better, im a go dev

BaldbytesOP•15mo ago

how can i set it as solved? cant see the thing above described

BaldbytesOP•15mo ago

oh thanks

Brody•15mo ago

no problem 🙂

Floris•15mo ago

python ❤️

Gaming

Programming

Cant deploy my Shopify App