CODEWITHSUNDEEP
next.js
FabricioG
FabricioG

Reputation: 3320

Bootstrap in Next Js can't resolve

According to the documentation in the latest NextJS I can use a style sheet (bootstrap) by doing the following: pages/_app.js

import '../static/bootstrap.min.css'

// this default export is required in a enw file
export default function MyApp({ Component, pageProps }) {
  return <Component {...pageProps} />
}

Then I can run my project and utilize bootstrap.
When I do the above I get the following error:

[ error ] ./static/bootstrap.min.css (./node_modules/css-loader/dist/cjs.js??ref--5-oneOf-5-1!./node_modules/postcss-loader/src??__nextjs_postcss!./static/bootstrap.min.css)
Module not found: Can't resolve '../fonts/glyphicons-halflings-regular.eot' in '/Volumes/OGX/Code/itsyoo/static'

Any idea how I can resolve this?

Upvotes: 2

Views: 1797

Answers (1)

Nikolai Kiselev
Nikolai Kiselev

Reputation: 6603

It says that fonts can't be found in the directory. You can put fonts there or use npm package.

I suggest to install Bootstrap with npm.

npm i bootstrap

Include it in the _app.js like import 'bootstrap/dist/css/bootstrap.min.css'.

Upvotes: 3

Related Questions