Nextjs boiler plate development server giving error #28632
Description
What version of Next.js are you using?
11.1.1
What version of Node.js are you using?
14.17.1
What browser are you using?
firefox
What operating system are you using?
Windows 10
How are you deploying your application?
localhost using npm run dev
Describe the Bug
I installed create-next-app tried starting a development server without changing any code provided by boilerplate. I get this error
error - ./styles/globals.css
Global CSS cannot be imported from files other than your Custom <App>. Due to the Global nature of stylesheets, and to avoid conflicts, Please move all first-party global CSS imports to pages/_app.js. Or convert the import to Component-Level CSS (CSS Modules).
Read more: https://nextjs.org/docs/messages/css-global
Location: pages\_app.js
Expected Behavior
The boilerplate next webpage should open automatically
To Reproduce
in command prompt run following commands
npx create-next-app next_js_list # since this is first time installing running this command create-next-app is installed
cd next_js_list #after above command completes execution
npm run dev
entire error message
ready - started server on 0.0.0.0:3000, url: http://localhost:3000
info - Using webpack 5. Reason: Enabled by default https://nextjs.org/docs/messages/webpack5
(node:1464) [DEP_WEBPACK_MODULE_ISSUER] DeprecationWarning: Module.issuer: Use new ModuleGraph API
(Use `node --trace-deprecation ...` to show where the warning was created)
error - ./styles/globals.css
Global CSS cannot be imported from files other than your Custom <App>. Due to the Global nature of stylesheets, and to avoid conflicts, Please move all first-party global CSS imports to pages/_app.js. Or convert the import to Component-Level CSS (CSS Modules).
Read more: https://nextjs.org/docs/messages/css-global
Location: pages\_app.js