Skip to content

Instantly share code, notes, and snippets.

@LearnWebCode

LearnWebCode/next.config.js

Created February 23, 2024 21:59
Show Gist options
  • Save LearnWebCode/542f15ec8e44b3677199071a49728dd6 to your computer and use it in GitHub Desktop.
Save LearnWebCode/542f15ec8e44b3677199071a49728dd6 to your computer and use it in GitHub Desktop.
Download ZIP
For outputting static HTML files from Next.js that any server can easily host (I was integrating with an old WordPress site for the rest of the domain)
Raw
next.config.js
/**
* @type {import('next').NextConfig}
*/
const nextConfig = {
output: "export",
trailingSlash: true,
images: { unoptimized: true }
}
module.exports = nextConfig
@islamBelabbes
Copy link

I'm a bit confused about how this works. If I have an existing WordPress website, can I integrate Next.js into a specific section, like mydomain.com/nextjsapp, and build a Single Page Application (SPA) there? I'd love to know how you achieved this on your website. I'm currently building a Next.js app for my site and initially thought I needed a subdomain to make it work, but I'm open to other options. Thanks in advance for your help!

i think since nextjs will just output static HTML js CSS you can move them to your hosting like you would do with any other static files I'm not sure if nextjs router requires nodejs or not but I think you can start from here
but I also think you don't even need nextjs you can just build a vite ( react ) app and use that into any section via shortcode

Hi there! Thanks so much for getting back to me. I might have run into a bit of a hurdle. It seems like the styles from my WordPress theme might override the ones in my Next.js app. Do you happen to have any tips on how to deal with that? Any advice would be super helpful!

if you use Tailwind CSS then yes
Brad made a video about this
but if not I think you need to use Uniq classess and some !important

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment