I've been working on creating a new Next app using the npx create-next-app command, but I keep encountering an error without making any changes.
ERROR:
npm run dev
npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.
> <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="ef9b8a9c9bafdfc1dec1df">[email protected]</a> dev
> next dev
ready - started server on 0.0.0.0:3000, url: http://localhost:3000
(node:23324) [DEP_WEBPACK_MODULE_ISSUER] DeprecationWarning: Module.issuer: Use
new ModuleGraph API
(Use `node --trace-deprecation ...` to show where the warning was created)
error - ../../#HACKYOURBIZ/test/styles/globals.css
Global CSS cannot be imported from files other than your Custom <App>. Due to th
e Global nature of stylesheets, and to avoid conflicts, Please move all first-pa
rty global CSS imports to pages/_app.js. Or convert the import to Component-Leve
l CSS (CSS Modules).
Read more: https://nextjs.org/docs/messages/css-global
Location: ..\..\#HACKYOURBIZ\test\pages\_app.js
Any suggestions on how to resolve this issue and get my app up and running?
My previous Next apps were functioning properly, so it's strange that this error is occurring with a new one.
Below is the package.json file for reference:
{
"name": "test",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"next": "12.2.0",
"react": "18.2.0",
"react-dom": "18.2.0"
},
"devDependencies": {
"eslint": "8.19.0",
"eslint-config-next": "12.2.0"
}
}