I am trying next-payload-demo locally and after when I visit localhost:3000/admin I get the following error:
error - ./css/app.scss
Module parse failed: Unexpected character '@' (1:0)
@use './queries.scss' as *;
| @use './colors.scss' as *;
| @use './type.scss' as *;
any hint?
This seems like a Webpack/Sass error
or scss
Like the module for parsing isn't being included or something of that nature
This is the output of yarn:
warning ../../package.json: No license field
info No lockfile found.
[1/4] Resolving packages...
warning payload > css-minimizer-webpack-plugin > cssnano > cssnano-preset-default > postcss-svgo > svgo > stable@0.1.8: Modern JS already guarantees Array#sort() is a stable sort, so this library is deprecated. See the compatibility table on MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#browser_compatibility
[2/4] Fetching packages...
[3/4] Linking dependencies...
warning " > @aws-sdk/lib-storage@3.319.0" has unmet peer dependency "@aws-sdk/abort-controller@^3.0.0".
warning "@payloadcms/next-payload > webpack-filter-warnings-plugin@1.2.1" has unmet peer dependency "webpack@^2.0.0 || ^3.0.0 || ^4.0.0".
warning "payload > @monaco-editor/react@4.5.0" has unmet peer dependency "monaco-editor@>= 0.25.0 < 1".
warning "payload > react-select@3.2.0" has incorrect peer dependency "react@^16.8.0 || ^17.0.0".
warning "payload > react-select@3.2.0" has incorrect peer dependency "react-dom@^16.8.0 || ^17.0.0".
warning "payload > react-diff-viewer@3.1.1" has incorrect peer dependency "react@^15.3.0 || ^16.0.0".
warning "payload > react-diff-viewer@3.1.1" has incorrect peer dependency "react-dom@^15.3.0 || ^16.0.0".
warning "payload > use-context-selector@1.4.1" has unmet peer dependency "scheduler@>=0.19.0".
warning "payload > @monaco-editor/react > @monaco-editor/loader@1.3.3" has unmet peer dependency "monaco-editor@>= 0.21.0 < 1".
warning "payload > react-select > react-input-autosize@3.0.0" has incorrect peer dependency "react@^16.3.0 || ^17.0.0".
warning " > payload-admin-bar@1.0.5" has incorrect peer dependency "react@^17.0.0".
warning " > payload-admin-bar@1.0.5" has incorrect peer dependency "react-dom@^17.0.0".
warning " > sass-loader@13.2.2" has unmet peer dependency "webpack@^5.0.0".
warning Workspaces can only be enabled in private projects.
Hey @fedoraman some changes were pushed to this template today, I would pull those in to start. Have you ran
yarn or npm install
to install the dependencies?
Same issue!
yarn install v1.22.19
warning ../../package.json: No license field
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
warning " > @aws-sdk/lib-storage@3.282.0" has unmet peer dependency "@aws-sdk/abort-controller@^3.0.0".
warning " > @payloadcms/next-payload@0.0.21" has incorrect peer dependency "payload@^1.7.1".
warning "@payloadcms/next-payload > webpack-filter-warnings-plugin@1.2.1" has unmet peer dependency "webpack@^2.0.0 || ^3.0.0 || ^4.0.0".
warning "payload > @monaco-editor/react@4.4.6" has unmet peer dependency "monaco-editor@>= 0.25.0 < 1".
warning "payload > express-graphql@0.12.0" has incorrect peer dependency "graphql@^14.7.0 || ^15.3.0".
warning "payload > react-diff-viewer@3.1.1" has incorrect peer dependency "react@^15.3.0 || ^16.0.0".
warning "payload > react-diff-viewer@3.1.1" has incorrect peer dependency "react-dom@^15.3.0 || ^16.0.0".
warning "payload > react-select@3.2.0" has incorrect peer dependency "react@^16.8.0 || ^17.0.0".
warning "payload > react-select@3.2.0" has incorrect peer dependency "react-dom@^16.8.0 || ^17.0.0".
warning "payload > use-context-selector@1.4.1" has unmet peer dependency "scheduler@>=0.19.0".
warning "payload > @monaco-editor/react > @monaco-editor/loader@1.3.2" has unmet peer dependency "monaco-editor@>= 0.21.0 < 1".
warning "payload > react-select > react-input-autosize@3.0.0" has incorrect peer dependency "react@^16.3.0 || ^17.0.0".
warning " > payload-admin-bar@1.0.5" has incorrect peer dependency "react@^17.0.0".
warning " > payload-admin-bar@1.0.5" has incorrect peer dependency "react-dom@^17.0.0".
warning " > sass-loader@13.2.0" has unmet peer dependency "webpack@^5.0.0".
[4/4] Building fresh packages...
This is the output of yarn dev:
yarn run v1.22.19
warning ../../package.json: No license field
$ next dev
warn - You are using a non-standard "NODE_ENV" value in your environment. This creates inconsistencies in the project and is strongly advised against. Read more: https://nextjs.org/docs/messages/non-standard-node-env
warn - You are using a non-standard "NODE_ENV" value in your environment. This creates inconsistencies in the project and is strongly advised against. Read more: https://nextjs.org/docs/messages/non-standard-node-env
ready - started server on 0.0.0.0:3000, url: http://localhost:3000
...
warn - You have enabled experimental features (appDir, outputFileTracingExcludes) in next.config.js.
warn - Experimental features are not covered by semver, and may cause unexpected or broken application behavior. Use at your own risk.
info - Thank you for testing
appDir
please leave your feedback at https://nextjs.link/app-feedback
warning ../../package.json: No license field
(node:403418) ExperimentalWarning: The Fetch API is an experimental feature. This feature could change at any time
(Use
node --trace-warnings ...
to show where the warning was created)
event - compiled client and server successfully in 1075 ms (266 modules)
wait - compiling...
event - compiled client and server successfully in 320 ms (266 modules)
wait - compiling /_error (client and server)...
event - compiled client and server successfully in 248 ms (267 modules)
warn - Fast Refresh had to perform a full reload due to a runtime error.
wait - compiling /(site)/page (client and server)...
error - ./css/app.scss
Module parse failed: Unexpected character '@' (1:0)
> @use './queries.scss' as *;
| @use './colors.scss' as *;
| @use './type.scss' as *;
Ok it is working now 🙂
what did you do to fix it
Star
Discord
online
Get help straight from the Payload team with an Enterprise License.