javascript - "Fel: Stilar kunde inte tilldelas en fil" vid byggande av React-app

Att köra npm run build ger detta fel. Jag tror att det fungerade korrekt för 3-4 månader sedan och faktiskt fungerar npm run dev utmärkt. Jag misstänker att det har något att göra med borttagningskravet för @vanilla-extract/babel-plugin

> [email  dev
> next dev

ready - started server on 0.0.0.0:3000, url: http://localhost:3000
event - compiled client and server successfully in 672 ms (291 modules)
wait  - compiling...
event - compiled client and server successfully in 68 ms (291 modules)
wait  - compiling / (client and server)...
event - compiled client and server successfully in 72 ms (294 modules)
wait  - compiling /_error (client and server)...
event - compiled client and server successfully in 57 ms (295 modules)
Error: Styles were unable to be assigned to a file. This is generally caused by one of the following:

- You may have created styles outside of a '.css.ts' context
- You may have incorrect configuration. See https://vanilla-extract.style/documentation/getting-started
    at Object.getFileScope (/home/asdf/work/i-nuba-wellness-front/node_modules/@vanilla-extract/css/fileScope/dist/vanilla-extract-css-fileScope.cjs.dev.js:33:11)
    at generateIdentifier (/home/asdf/work/i-nuba-wellness-front/node_modules/@vanilla-extract/css/dist/vanilla-extract-css.cjs.dev.js:183:49)
    at createVar (/home/asdf/work/i-nuba-wellness-front/node_modules/@vanilla-extract/css/dist/vanilla-extract-css.cjs.dev.js:262:47)
    at /home/asdf/work/i-nuba-wellness-front/node_modules/@vanilla-extract/css/dist/vanilla-extract-css.cjs.dev.js:310:12
    at walkObject (/home/asdf/work/i-nuba-wellness-front/node_modules/@vanilla-extract/private/dist/vanilla-extract-private.cjs.dev.js:38:20)
    at Object.walkObject (/home/asdf/work/i-nuba-wellness-front/node_modules/@vanilla-extract/private/dist/vanilla-extract-private.cjs.dev.js:40:20)
    at createThemeContract (/home/asdf/work/i-nuba-wellness-front/node_modules/@vanilla-extract/css/dist/vanilla-extract-css.cjs.dev.js:309:19)
    at createGlobalTheme (/home/asdf/work/i-nuba-wellness-front/node_modules/@vanilla-extract/css/dist/vanilla-extract-css.cjs.dev.js:330:38)
    at eval (webpack-internal:///./styles/vars.css.ts:33:85)
    at ./styles/vars.css.ts (/home/asdf/work/i-nuba-wellness-front/.next/server/pages/_app.js:132:1)

och detta är bilden jag ser i webbläsaren:

och det här är min package.json

{
  "name": "wellness-saas",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@vanilla-extract/babel-plugin": "^1.1.7",
    "@vanilla-extract/css": "^1.9.2",
    "@vanilla-extract/css-utils": "^0.1.2",
    "axios": "^0.27.2",
    "chart.js": "^3.9.1",
    "classnames": "^2.3.1",
    "next": "12.2.5",
    "next-auth": "^4.10.3",
    "prop-types": "^15.8.1",
    "react": "18.2.0",
    "react-chartjs-2": "^4.3.1",
    "react-cookie": "^4.1.1",
    "react-dom": "18.2.0",
    "react-loading": "^2.0.3",
    "styled-components": "^5.3.5"
  },
  "devDependencies": {
    "@types/node": "18.7.6",
    "@types/react": "18.0.17",
    "@types/react-dom": "18.0.6",
    "@vanilla-extract/next-plugin": "^2.1.1",
    "eslint": "8.22.0",
    "eslint-config-next": "12.2.5",
    "typescript": "4.7.4"
  }
}

Som jag sa, jag tror att det fungerade tidigare, kanske någon paket har uppdaterats som inte specificerades i package.json?

Jag tror att vanilla-extract-paketet är korrekt installerat och konfigurerat. Jag funderar på att använda webpack men det är förmodligen någon paketstruktur som är felkonfigurerad, jag skulle helst inte byta till webpack än.

Relaterade artiklar