'when i add `"type":"module",`in `package.json`, remix config error

when i add "type":"module",in package.json, error occur...

error:

[1] Building Remix app in production mode...
[1] Error: Error loading Remix config in /Users/hyeseonhan/Desktop/admin-remix/remix.config.js
[1]     at Object.readConfig (/Users/hyeseonhan/Desktop/admin-remix/node_modules/@remix-run/dev/config.js:67:11)
[1]     at Object.build (/Users/hyeseonhan/Desktop/admin-remix/node_modules/@remix-run/dev/cli/commands.js:151:31)
[1]     at Object.run (/Users/hyeseonhan/Desktop/admin-remix/node_modules/@remix-run/dev/cli/run.js:351:22)
[1]     at Object.<anonymous> (/Users/hyeseonhan/Desktop/admin-remix/node_modules/@remix-run/dev/cli.js:16:11)
[1]     at Module._compile (node:internal/modules/cjs/loader:1103:14)
[1]     at Object.Module._extensions..js (node:internal/modules/cjs/loader:1155:10)
[1]     at Module.load (node:internal/modules/cjs/loader:981:32)
[1]     at Function.Module._load (node:internal/modules/cjs/loader:822:12)
[1]     at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:77:12)
[1]     at node:internal/main/run_main_module:17:47
[1] remix build && run-p dev:* exited with code 1

package.json:

{
  "name": "remix-template-express-ts",
  "private": true,
  "description": "",
  "license": "",
  "sideEffects": false,
  "type":"module",
  "scripts": {
    "build": "yarn build:css && remix build",
    "build:css": "tailwindcss -m -i ./styles/app.css -o app/styles/app.css",
    "dev": "concurrently \"yarn dev:css\" \"remix build && run-p dev:*\"",
    "dev:css": "tailwindcss -w -i ./styles/app.css -o app/styles/app.css",
    "dev:node": "cross-env NODE_ENV=development nodemon ./build/index.js --watch ./build/index.js  --exec babel-node",
    "dev:remix": "remix watch",
    "postinstall": "remix setup node",
    "start": "cross-env NODE_ENV=production node ./build/index.js"
  },
  "dependencies": {
    "@babel/plugin-syntax-import-meta": "^7.10.4",
    "@babel/plugin-transform-runtime": "^7.17.10",
    "@ckeditor/ckeditor5-build-classic": "^34.0.0",
    "@fullcalendar/core": "^5.11.0",
    "@fullcalendar/interaction": "^5.11.0",
    "@googlemaps/js-api-loader": "^1.14.2",
    "@headlessui/react": "^1.5.0",
    "@heroicons/react": "^1.0.6",
    "@left4code/tw-starter": "^3.1.33",
    "@remix-run/express": "^1.3.3",
    "@remix-run/react": "^1.3.3",
    "@tailwindcss/forms": "^0.5.0",
    "@types/qs": "^6.9.7",
    "axios": "^0.26.1",
    "chart.js": "^3.7.1",
    "classnames": "^2.3.1",
    "compression": "^1.7.4",
    "cross-env": "^7.0.3",
    "dayjs": "^1.11.2",
    "dropzone": "^6.0.0-beta.2",
    "express": "^4.17.1",
    "heroicons": "^1.0.6",
    "highlight.js": "^11.5.1",
    "js-beautify": "^1.14.3",
    "jwt-decode": "^3.1.2",
    "lodash": "^4.17.21",
    "lucide-react": "^0.44.0",
    "morgan": "^1.10.0",
    "qs": "^6.10.3",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-hook-form": "^7.29.0",
    "react-query": "^3.34.19",
    "react-table": "^7.7.0",
    "react-transition-group": "^4.4.2",
    "remix": "^1.4.3",
    "tiny-slider": "^2.9.4",
    "tippy.js": "^6.3.7",
    "toastify-js": "^1.11.2",
    "tom-select": "^2.0.2"
  },
  "devDependencies": {
    "@babel/cli": "^7.17.10",
    "@babel/core": "^7.17.10",
    "@babel/node": "^7.17.10",
    "@babel/polyfill": "^7.12.1",
    "@babel/preset-env": "^7.17.10",
    "@remix-run/dev": "^1.3.3",
    "@remix-run/eslint-config": "^1.3.3",
    "@types/react": "^17.0.24",
    "@types/react-dom": "^17.0.9",
    "@types/react-table": "^7.7.10",
    "autoprefixer": "^10.4.4",
    "babel-loader": "^8.2.5",
    "concurrently": "^7.0.0",
    "eslint": "^8.11.0",
    "nodemon": "^2.0.15",
    "npm-run-all": "^4.1.5",
    "postcss": "^8.4.12",
    "tailwindcss": "^3.0.23",
    "typescript": "^4.5.5"
  },
  "engines": {
    "node": ">=14"
  }
}

remix.config.js

/**
 * @type {import('@remix-run/dev').AppConfig}
 */
module.exports = {
  server: "./server.js",
  ignoredRouteFiles: [".*"],
  devServerBroadcastDelay: 1000,
  // appDirectory: "app",
  // assetsBuildDirectory: "public/build",
  // serverBuildPath: "build/index.js",
  // publicPath: "/build/",
};



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source