I have a large Nuxt.js project with many different components. Now I want to reuse these components in a new project which uses WordPress. So for example I want to be able to display a certain component on a WordPress page or post.
My first thought was to only use Vue.js without Nuxt but then I would not be able to use the Nuxt components without having to remove Nuxt-specific code. I know that there is also a way to use Nuxt programmatically as a middleware but I can't figure out how to do this with WordPress.
Can someone guide me into the right direction?
Related
I have been developed a wordpress plugin along with vue js. Right now i want make this plugin multi lingual.
Can you guys please helps me out to how i can use vue i18n in wordpress plugin.
I tried to use wp-vue-i18n. But still failed because of proper documentation.
I have an existing website where I am gradually replacing the html/css interfaces with Vue technology. So now I have pages with two logics
Pages completely in vue
Pages with html/css parts and vue parts.
Currently I am using Vue (without Nuxt) with success to do this migration. In my wordpress theme I load vue scripts as follows
wp_register_script('vue-app', $directory_uri . '/js/app.js', array(), $version, true);
wp_enqueue_script('vue-app');
In order to improve my project I am switching to Nuxt. But I can't keep the same logic of integration. Nuxt does not create a unique app.js. Nuxt is generating a whole bunch of files and I cannot load them synchronously. Neither in build nor in dev (hot-module-replacement).
I don't know how to keep my logic 1 and 2 with Nuxt. Do you have any solutions ?
If you want to use Nuxt to it's full potential and keep Wordpress, you need to use Wordpress as a headless CMS. Meaning that you may use Full static and generate all of your pages during build time by reaching to your Wordpress app.
I guess that your current Wordpress + Vue flow is lacking SEO hence why you're trying to reach upon Nuxt. But to my knowledge, you will not be able to just plug it like that with your wp_register_script.
Or maybe try to mount it for every one of your routes .../about, .../our-team etc... Not a wordpress expert tho.
I want to make a website using Next.js but I want to use WordPress for marketing pages. Let's say I want to use WordPress for a path example.com/sales and Next.js for others. I thought it could be done with load balancing but I'm new to this topic and not sure what I should do. How do I do that?
I think what you are looking for is called incremental adoption. Basically if a certain path is not part of your nextjs app, the traffic falls back to the specified url.
here are the official docs
I am working for an organization that has a wordpress website, I am building a react app that will pull data from the wordpress database through the wordpress API. I am trying to figure out how I can tell wordpress to serve the react app as though the user were simple visiting another page on our site. Is this possible or is my only option to serve the react app on another server?
The first thing to know about React on a standard server : you will be able to serve your react app separately onto the same server only if you have access to the CLI (command-line). React has to be built by webpack so it'll be impossible to compile, build and serve your react app without using npm or yarn.
If you don't have access to the CLI, and the Gutenberg wordpress editor is available inside your WordPress, I do suggest you to enqueue React into your theme/custom theme or inside a plugin. A link worth 100 words, please take a look at https://javascriptforwp.com/enqueue-react-in-wordpress/ in order to do it properly.
Basically, you will just have to set an ID or a class name to an element of your DOM body, then React will be mounted on this block and you'll use the ReactDOM render() method from wp.element JS object to do so (React lib is available and given from the Gutenberg editor 😊)
Hope this can help you with your question 😇
I figured it out. Thank you for your suggestions. I have decided to create a sub directory in my public_html folder and put the react app there.
So i have built an angular website that uses the GoogleBooksAPI to fetch some book list. And then I show it on my single page app.
Now, i'd like to deploy it somehow to see if it's working.
So i tried to add the project to github pages. github project link:
https://github.com/DrorSC/DrorSC.github.io
And was unsuccesful..
So i thought on a different option. I have a domain, and a wordpress site on it. Maybe i can add the files to my Cpanel and load it into my domain? Or can i do it straight from wordpress?
Tried to look for answers, couldn't find.
Please help. thank you :)
If I understand correctly I think Angular Element will be your best choice. It works the best if you want to integrate Angular web app into your existing website.
Building Custom Elements / Web Components with Angular 6
After build the project. You can use the content of the dist directory into your host.
If you will put your code into a subfolder, you will need specify the path as argument on the CLI for the build.