javascript - "Feil: Stiler kunne ikke tildeles en fil" når du bygger en React-app

Å kjøre npm run build gir denne feilen. Jeg tror det fungerte som det skulle for 3-4 måneder siden, og faktisk fungerer npm run dev veldig bra. Jeg mistenker at det har noe å gjøre med fjerningen av kravet til @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)

og dette er bildet jeg ser i nettleseren:

og dette er 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 jeg sa, jeg tror det fungerte før, kanskje noen pakker har blitt oppdatert som ikke var spesifisert i package.json?

Vanilje-ekstraktpakken er riktig installert og konfigurert, tror jeg. Jeg vurderer å bruke webpack, men det er sannsynligvis en feil i pakkeoppsettet; jeg vil helst ikke bytte til webpack ennå.

Relaterte artikler