CODEWITHSUNDEEP
javascriptreactjsnext.js
Helmar Bachle
Helmar Bachle

Reputation: 117

Module not found: Can't resolve '../styles/global.css' in an next.js project

enter image description hereI am following the instruction on : https://nextjs.org/learn/basics/assets-metadata-css/global-styles

And getting error message when adding import '../styles/global.css' to _app.js

./pages/_app.js Module not found: Can't resolve '../styles/global.css' in 'C:\Users\Owner\Documents\tradingCFD\pages'

Upvotes: 3

Views: 27526

Answers (6)

Lerato Walters
Lerato Walters

Reputation: 66

replace

import '@/styles/globals.css'

with

import '../styles/globals.css'

Upvotes: 1

Marinos TBH
Marinos TBH

Reputation: 55

This points to the missed style-loader. Have you npm install --save-dev style-loader? If not, make sure to install the loader you required first.

Upvotes: 0

Víctor Manuel Nevárez Herrera
Víctor Manuel Nevárez Herrera

Reputation: 1

I solved it by running npm run tailwind

Upvotes: -1

glimmbo
glimmbo

Reputation: 301

Not exactly the same problem as the OP but in my case, using styled-components createGlobalStyle, I incorrectly referenced the file as ../styles/global and it build fine locally even though the filename was Global.js. The build on Vercel wasn't so lenient.

TLDR: double check capitalization on file refs 😅

Upvotes: 1

Gian
Gian

Reputation: 326

I was having this issue. The tutorial tells you to restart the server, do it.

Restart the Development Server

Important: You need to restart the development server when you add pages/_app.js. Press Ctrl + c to stop the server and run:

 npm run dev

If you put _app and global in the correct folders, it should run OK.

Upvotes: 4

Zac Anger
Zac Anger

Reputation: 7787

Your global.css seems to be in public/styles., not just styles/. The styles directory should be moved up a level to be in the app root.

Upvotes: 6

Related Questions