skip to Main Content

I’m trying to export my project to static HTML pages and I don’t get the CSS styles

My configuration in next.config.js

** @type {import('next').NextConfig} */
const nextConfig = {
  images: {
    unoptimized: true,
  },
  output: "export",
  reactStrictMode: false,
};

module.exports = nextConfig;

and when I try to run npm run build I find that the files do appear in the output folder but when I put them on a web server the CSS styles are not there

Try making a new example by running

npx create-next-app@lates

in next.config.js I put
output: "export",
and execute

npm run build

and the CSS is not exported either

Maybe nextjs no longer allows you to export static pages?

In the console I don’t get any errors, only the files are without styles and probably also without JavaScript

2

Answers


  1. Chosen as BEST ANSWER

    NO CSS

    This is how it looks on my hosting


  2. Try this

    /** @type {import('next').NextConfig} */
    const nextConfig = {
      reactStrictMode: true,
      distDir: "build",
      output: "export",
    };
    
    module.exports = nextConfig;
    

    Ensure that your CSS files are being imported correctly in your components/pages. Verify that the import paths are correct, and the CSS files are present in the expected locations.

    Worked for me.

    css location should be there

    yourAppbuild_nextstaticcss

    Here you can find more.

    https://nextjs.org/docs/pages/building-your-application/deploying/static-exports

    Hope It will work.
    I am new to this too. Good Luck!

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search