Nuxt.js (Vue) Integration
Add your AEO blog to a Nuxt.js application using route rules.
Nuxt 3 has built-in proxy support through Nitro's route rules. Nuxt 2 uses the @nuxtjs/proxy module. Both approaches are straightforward and require just a few lines of configuration.
Requirements
- Nuxt 3: no additional packages needed (Nitro handles proxying natively).
- Nuxt 2: install @nuxtjs/proxy (npm install @nuxtjs/proxy).
- Must be running in SSR mode (not static generation) for proxying to work.
- If you use static generation (nuxt generate), use Nginx or your hosting platform's rewrite rules instead.
Nuxt 3: Add route rules in nuxt.config.ts
Open nuxt.config.ts and add the routeRules option:
export default defineNuxtConfig({
routeRules: {
"/blog/**": {
proxy: { to: "https://aeo.how/blog/**" },
},
"/blog": {
proxy: { to: "https://aeo.how/blog" },
},
},
});Nitro (Nuxt 3's server engine) intercepts matching requests and proxies them to AEO.
Nuxt 2: Install and configure @nuxtjs/proxy
First install the module:
npm install @nuxtjs/proxyThen add to nuxt.config.js:
module.exports = {
modules: ["@nuxtjs/proxy"],
proxy: {
"/blog": {
target: "https://aeo.how",
changeOrigin: false,
},
},
};Keep changeOrigin set to false (the default) so your original Host header is forwarded to AEO. Setting it to true would replace the Host with aeo.how, breaking domain detection.
Test locally
Run your Nuxt dev server and visit localhost:3000/blog. You should see your AEO blog content.
Deploy
Deploy as usual. Make sure you deploy in SSR mode (not static). The proxy rules work the same in production.
If deploying to Vercel or Netlify, consider using their native rewrite rules instead. See the Cloud Hosting guide.
Nuxt 3 route rules are the cleanest solution: no extra packages needed.
If using static generation (nuxt generate), proxying won't work. Use Nginx or your cloud hosting's rewrite rules.