When you make a new custom post type, and want it and its ACF & Yoast meta fields to show in the API you have to:

1. Support custom fields in the post type:
   'supports' => array('custom-fields')
2. Support rest in the post type:
   'show_in_rest' => true
3. Make the wuxt_register_acf_meta() register meta for the new post type as well:
   register_post_meta('recommendation', $field['name'], array('show_in_rest' => true));
4. Do the same in the wuxt_register_yoast_meta():
   register_post_meta('recommendation', $field, array('show_in_rest' => true));
5. Add stuff to the nuxt/modules/wp-api/plugin.js:
   import registerRecommendation from '~/modules/wp-api/routes/recommendation'
6. Add more stuff to the same file:
   registerRecommendation(wp)
7. Make a new file nuxt/modules/wp-api/routes/recommendation.js:

export default wp =>
  (wp.recommendation = wp.registerRoute('wp/v2', '/recommendation/(?P<id>)', {
    params: ['embed']
  }))

Maybe this can be simplified somehow, but at least it needs to be documented. 🤓

After booting up docker, I get the error: "ERR_EMPTY_RESPONSE"

I experienced the error after dowing and then upping the docker server. I didn't change anything, and it just happened out of the blue.

I managed to get the page back, after messing around with yarn install and yarn run dev inside the /nuxt/ folder, but after downing the server again ( to change Docker resources ), now after booting up again, I can't access the front end.

I have no other browsersync/etc running on port 3000 atm. I can access the WordPress backend without any issues.

I installed the docker image, but can't install Wordpress on http://localhost:3080/ The other pages (eg. http://localhost:3080/wp-admin/themes.php ) give me this error screen

I think it has some problem with the database, but don't know what could be the problem. I checked the Terminal and it seems the mysql server is also running
Creating wp.wuxt ... done
Creating mysql.wuxt ... done
Creating front.wuxt ... done

I can see the Wuxt open page at http://localhost:3000/ though.
Using macOS High Sierra.

Thanks for the help, waiting eagerly to work on the Wuxt Development :-)

Hi everybody,

I start using wuxt for a production website but I need to use it with multilanguage.
I install polylang-pro and it has a language filter in api rest, for example:
/wp-json/wp/v2/posts?lang=en

I try this kind of filter with wuxt custom routes calling it in nuxt with .slug('xxx').params('lang', 'en'), but it doesn't work.
I'm looking into wuxt wordpress plugin that exposes api, but I'm not a php/wordpress expert and I cannot undestand how to implement it.

Can someone help me?

When using the /wp-admin/ on a fresh install, it's okay speed. But as soon as you start to install some plugins (WPML, WooCommerce, etc) the speed slows down alot.

Even using the wp-rest api, will take a few seconds to respond.

I have tested out, using a different, yet popular, docker image: https://github.com/visiblevc/wordpress-starter

It's blazingly fast.

My suggestion is: Let's base wuxt on the setup that visiblevc/wordpress-starter has. I think this would create a much faster and more pleasant development environment.

Heres a comparrsion.

Using northosts/wuxt docker:

Using visiblevc/wordpress-starter docker:

I found the library through this SO question, and the answer explains why visblevs/wordpress-starter might be so fast: https://stackoverflow.com/questions/54291859/docker-wordpress-super-slow

Just installed the WUXT plugin in a fresh install of wordpress. Setup and applied a menu to my one menu location defined in functions.php but the WUXT rest end point claims the menu doesn't exist.

I feel like there is likely an extra step I need to take but its not clear what that is. Particularly since all of the other end points are working perfectly.

Any reason the menu end point would claim no menu location exists when one is clearly defined and assigned in wordpress?

i wanted to use JWT authentication with wuxt but i have this error.
{"code":"rest_no_route","message":"No route was found matching the URL and request method.","data":{"status":404}}

i think is because wnuxt didt need a wp-config file but i manually create one and pu the JWT_AUTH but it didt detect it, how should i make this work ? anyone tried

i am follow this post
https://hashinteractive.com/blog/headless-wordpress-jwt-vue-authentication/

I'm getting 404 errors whenever I try to reload any post. Navigation between pages from the UI works fine, but I cannot reload a post or even go to the post page directly.

This includes sample post & page as well as newly created posts:
http://localhost:4000/sample-page
http://localhost:4000/hello-world

Can you please help?

Thanks a lot for this great project!

I have been working on a site and created a navbar that uses Nuxt Links to navigate between pages.
It was working 100% and I am not sure if anything has changed, I just rebuilt the containers.
For some reason the links for nuxt-link is now creating a link to http://wp.wuxt/wp-json/wuxt/v1/slug/about etc

When it wasn't doing this before?

Hi guys, there's a way to deploy a ssr app?

How do you deploy production?
Because Wordpress needs a webhook if you want to generate everytime a static website.

I need a deploy solution that doesn't need coding skills for update content.
Maybe a full docker machine with nuxt build && nuxt start instead of nuxt?

Hi there,

Thanks again for this brilliant starter kit.

I'm having some trouble working with the menus, and I wanted to know if you had any example code from your Nuxt app that you can share that would produce a nav menu? Particularly in the sense of preserving the correct ordering via the menu_order key.

It doesn't seem to be very straight forward to work this, so I'm hoping you guys can provide something in your example app to help get off the ground with it quickly.

This is a great project but I have no idea where the wp-config.php lives so not sure how to piece together multisite.

Hello!

I run 6 instances od Wuxt on my Linux server (i try to make Wuxt to be CMS like for managing content, which will be staticaly served). I run 6 containers and when they all run, after some time randomly in one of two of them just crashed:

test3-front.wuxt | ✔ Builder initialized
test3-front.wuxt | ✔ Nuxt files generated
test3-front.wuxt | Browserslist: caniuse-lite is outdated. Please run next command yarn upgrade
test3-front.wuxt | ℹ Compiling Client
test3-front.wuxt | ℹ Compiling Server
test3-front.wuxt | (node:68) DeprecationWarning: Tapable.plugin is deprecated. Use new API on .hooks instead
test3-front.wuxt | ✔ Server: Compiled successfully in 9.99s
test3-front.wuxt | ✔ Client: Compiled successfully in 11.92s
test3-front.wuxt | ℹ Waiting for file changes
test3-front.wuxt |
test3-front.wuxt | READY Server listening on http://0.0.0.0:3000
test3-front.wuxt |
test3-front.wuxt | [nodemon] app crashed - waiting for file changes before starting...

Do anyone know what could be the reason for that? Thankx!

When trying to access http://0.0.0.0:3000/sample-page the front.wuxt container responds with a 404 error.

Steps to reproduce:

1. clone the repository
2. docker-compose up
3. click the "sample page" link

This issue persists after completing the wordpress installation at localhost:3080

I'm trying to set-up a Post with the fetched post-image, but as I see it needs another request for it, through the link which is available at
this.post._links['wp:featuredmedia'][0].href
but this object is only available after the post itself was loaded. Is there any other way to get the image (src link) parallel with the post content?

I think, by default these libs & loaders should be installed on the node container, so one can use lang="scss" on style tags in vue components:

yarn add node-sass sass-loader -D

Read more in Nuxt docs

If i run it in ./nuxt to mirror it to the container everything stops working. For me, I had to SSH into the node container, install it, and then restart docker to get it working.

Hi there,

How can I get the ACF options page information? For instance; I store my WordPress menu there, and need to fetch it on every page.

IMHO, Gulp is an outdated (or overcomplicated) solution for tasks runners.

Makefiles is old but work perfectly.

I created a custom name for my app in .env, called "front.jwr" instead of "front.wuxt", but when running yarn generate it fails with error:

yarn run v1.17.3
$ docker exec front.wuxt yarn generate && docker-compose --log-level CRITICAL -f dist.yml up -d && docker-compose --log-level CRITICAL -f dist.yml restart && docker-compose --log-level CRITICAL down && docker-compose --log-level CRITICAL up -d
Error: No such container: front.wuxt
error Command failed with exit code 1.

I have a difficulty to make the nav menu work with the fetched json data and nuxt-link (but possibly this is a question for building the navigation for the whole site)
My problem is that the links that are fetched from the wp json are different domain, and hence the nux-link appends it to the a href. Or am I doing something wrongly?
The code:

      <nav class="header__nav">
        <nuxt-link v-for="menu in menus" :key="menu.id" :to="{ path: menu.url }" >
            {{ menu.title }}
        </nuxt-link>
      </nav>

...

<script>

const hostAdress = "http://localhost:3080";

import Logo from '~/components/Logo'

export default {
  components: {   Logo  },
  data() {
    return { menus: [] }
  },
  mounted() {
    fetch(hostAdress + '/wp-json/wuxt/v1/menu')
    .then(response => {
      response.json().then(menus => {
        this.menus = menus;
      })
    })
  }

}
</script>

On the output I get

Thank you in advance and big thanks for making this framework! (a bit of Wiki/FAQ would be very-very nice though ;-) )

I notice the code in functions.php includes references to https://localhost:3000/ but I notice I cannot access the site using https. How can I enable local SSL for the site?

Hi!
I installed wuxt, started docker-compose up.

After I changed nuxt/components/templates/Page.vue nothing happened!

Add the possibility for previewing draft posts, secured from public viewing by nonces and/or authentication cookie.

Hi, have this been tested with WooCommerce? I am considering using wuxt for a WordPress site with 2500 products, and curious to know what the authors / people think of this in relation to this library?

I'm trying to set this up on my raspberry pi4, but when running docker-compose, I get:

5.7: Pulling from library/mysql
ERROR: no matching manifest for linux/arm64/v8 in the manifest list entries

I am trying to scaffold a custom post type with npm run scaffold:cpt <cpt name> command.

I am making sure to set up the .env file in the same main directory as docker-compose.yml as mentioned in the guide. I tried both options :

a) docker-compose down before creating .env manually followed by `docker-compose up -d.

b) using npm run env

However both ways gives me Error: Cannot find module 'dotenv'.

Is there anything I am missing? Thanks.

Hi all,

I'm using windows sublinux system and the windows version of docker.

I had no problem installing wuxt by following the quick start instructions.
git clone https://github.com/northosts/wuxt.git

cd wuxt
docker-compose up -d
http://localhost:3080/install.php - Install WordPress
http://localhost:3080/wp-admin/options-permalink.php - Set permalinks to Post name
http://localhost:3080/wp-admin/themes.php - Activate wuxt-theme
http://localhost:3000 - Done

When everything finishes preparing, wp.nuxt and mysql.nuxt containers run but front.wuxt had an issue saying "info No lockfile found." and
"error Couldn't find a package.json file in "/var/www/app"
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command."

this means I can't access the front end using localhost:3000

Also I couldn't activate wuxt-theme as it's not there when I visit /themes.php

Would anyone be able to help. I remember using wuxt on a full linux system without any issues but when I tried with WSL yesterday I experienced this issue.

Thank you!

How can I update the WordPress to version 5 or higher and if I can change the design of the page since I am using the wuxt theme?

Is it possible to use a templated wp-content for multiple projects?
I understand .env can be updated, but this is within a single project. I'm wondering if it's possible to still have separate project files but have a core wp-content folder? Use case for having multiple project folders: the use of child themes and different custom plugins.

Just did git clone and docker-compose up, and I go to localhost:3080 or localhost:3080/install.php it shows Error establishing a database connection

I got the Wuxt development server up and running - great.

Now I need to start writing components and setting up the frontend. As far as I can see, theres no documentation on this. I guess I simply need to setup a webpack config, including Vue2, babel etc, or is there some specific recommended approach to this?

Hi everybody

Someone of you can help me on adding Repeater type fields on rest api?
This code, found on your api plugin:

function nuxt_register_acf_meta() {
    if ( function_exists( 'acf_get_field_groups' ) ) {

        $result = array();
        $acf_field_groups = acf_get_field_groups();

        foreach( $acf_field_groups as $acf_field_group) {
            foreach($acf_field_group['location'] as $group_locations) {
                foreach($group_locations as $rule) {
                    foreach(acf_get_fields( $acf_field_group ) as $field) {
                        register_meta('post', $field['name'], array( 'show_in_rest' => true ) );
                    }
                }
            }
        }
    }
}

cannot show repeater fields, because they're nested I think.

Hi there,

ESLint is saying it cannot compile the template tags like this:

// https://github.com/northosts/wuxt/blob/master/nuxt/modules/wp-api/plugin.js
const wp = new WPApi(<%= serialize(options) %>);

I can't seem to find a solution to this online. How did you set this to work?

I'm trying to get my webpage to update on file changes with browser sync, but it doesn't work. The only way I can get the page to change according to my updates is by restarting the Docker container. Is there a known way of getting this to work?

Hi there,

I've been trying to use this boilerplate all day and I've followed the readme instructions. I have the project running and i'm trying to add in front end libraries that I want to use with my project and it's taking forever to install them.

Why is it so slow and is there any quick fix?
This took more than 10 minutes to install on an i7 macbook pro 8gb running mojave
I've ran other docker projects before and never had this problem with prehistoric install times

Thanks

yarn add v1.15.2
warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files. To clear this warning, remove package-lock.json.
[1/4] Resolving packages...
[2/4] Fetching packages...
info [email protected]: The platform "linux" is incompatible with this module.
info "[email protected]" is an optional dependency and failed compatibility check. Excluding it from installation.
info [email protected]: The platform "linux" is incompatible with this module.
info "[email protected]" is an optional dependency and failed compatibility check. Excluding it from installation.
info [email protected]: The platform "linux" is incompatible with this module.
info "[email protected]" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
warning "nuxt-buefy > [email protected]" has unmet peer dependency "vue@^2.6.11".
warning "@nuxtjs/vuetify > [email protected]" has unmet peer dependency "webpack@^4.36.0 || ^5.0.0".
warning "@nuxtjs/vuetify > [email protected]" has unmet peer dependency "vue@^2.6.4".
warning "@nuxtjs/vuetify > [email protected]" has unmet peer dependency "vue-template-compiler@^2.6.10".
warning "@nuxtjs/vuetify > [email protected]" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
warning "@nuxtjs/vuetify > vuetify-loader > [email protected]" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
warning " > [email protected]" has incorrect peer dependency "eslint@>=6.2.2".
warning " > [email protected]" has unmet peer dependency "webpack@^4.0.0".
warning " > [email protected]" has unmet peer dependency "webpack@^3.0.0 || ^4.0.0".```

Hey guys, probably very noobie question so sorry for that.
Im not sure where should I put my wordpress domain address when Im deploying my app so nuxt knows from where he can fetch the data.
Which file and variable is it?

Thanks for help!

Where do I customize the wp-config.php? I am currently experincing some errors, and the page is just white.

Is there a possibility with this docker container to have two base url endpoints (one for the front end nuxt deployment and one for the Wordpress deployment) and still be able to deploy to one platform as a single docker container?

Hey there, I tried to add vuetify to use in the nuxt folder but it seems to not be compatible, keeps crashing on docker-compose up with a Python error (I have it installed on my ubuntu machine)

I want to rewrite the working .fetch function to asyncData (to store the pages on the server), but it somehow doesn't work. I tried with the dummy json palceholder for now, but it doesn't return anything. Any idea why?

export default {

async asyncData({ $axios }) {
  const data = await $axios.$get('https://jsonplaceholder.typicode.com/todos/1')
  faketitle = this.data.title;
},

components: {
    Logo
  },
  data() {
    return { 
      menus: [],
      hostAdress: hostAdress,
      faketitle: ''
      }
  },
  mounted() { 
    fetch(hostAdress + '/wp-json/wuxt/v1/menu')
    .then(response => {
      response.json().then(menus => {
        this.menus = menus;
      })
    })
  }

}

Could be nice to have full support of typescript

All the containers are running. Followed the tutorial and applied wuxt theme, enabled post. When I go to the frontend http://localhost:3000/sample-page it shows

Request has been terminated Possible causes: the network is offline, Origin is not allowed by Access-Control-Allow-Origin, the page is being unloaded, etc. An error occurred while rendering the page. Check developer tools console for details.

When I look at the console, it says:
Access to XMLHttpRequest at 'http://localhost:3080/wp-json/wuxt/v1/slug/sample-page' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

sample-page:1 Failed to load resource: the server responded with a status of 500 (Internal Server Error)

I am trying to run the "generate" command but I am getting below error:

New Fetch API doesn't seem to work here? What dependencies should we update? I saw that the version on the nuxt folder is on 2.9.2 while the latest nuxt version is only on 2.13.3? Can you point me on the right directions