Giter Club home page Giter Club logo

Comments (7)

jmheretik avatar jmheretik commented on June 10, 2024 1

@george-sawdays you were right, there was a stupid mistake in the proxy configuration - should be fixed now!

As for the SSR universal mode, it's unfortunately not supported right now (as mentioned in the readme). I haven't yet figured out how to design the app to use PHP for server-side rendering since all of Kirby is written in PHP. I have some ideas and I will need to test them, once I have the time to work on this, to find out if and how it's gonna work.
But anyway - I'm all open for suggestions concerning the ssr mode!

from kirby-vue-starterkit.

jmheretik avatar jmheretik commented on June 10, 2024

hi! sure there is, you also have to follow the readme inside the chosen variant (https://github.com/jmheretik/kirby-vue-starterkit/tree/master/vue-json) ... once you cd into that folder you run npm run dev and it will serve the development vue app and watch for any changes made to vue templates.

from kirby-vue-starterkit.

aheadfullofcode avatar aheadfullofcode commented on June 10, 2024

Ah, I see that now. After running the npm run dev command I was using the details in kirby.config.js to see the site, so I wasn't getting the updating when I refreshed.

Do you know how I would standardize the two domains? Because I use the one generated by npm run dev I cannot access sub-pages...? Could you offer an explanation as to why this is?

Thanks

from kirby-vue-starterkit.

aheadfullofcode avatar aheadfullofcode commented on June 10, 2024

Hi, @jmheretik

Do you have any thoughts on the above?

from kirby-vue-starterkit.

jmheretik avatar jmheretik commented on June 10, 2024

Hi! The two domains are separate on purpose - for a case when you would want to have just a lightweight vue frontend at one URL and the headless backend on another, maybe even a different domain.

I think what you're looking for is the inject option in kirby.config.js. Please have a read here: https://github.com/jmheretik/kirby-vue-starterkit#deploying. This way the built vue app gets injected into kirby and substitutes the kirby frontend completely - that's the point of this starterkit after all :-)

And could you explain a bit more how are you not able to access sub-pages? On my end everything works so I don't know what you mean exactly. You run npm run dev to have a development version of vue running (at http://localhost:8080/ by default) which proxies requests to the backend (running at http://127.0.0.1:8000 by default) automatically - check vue.config.js for details how it happens. Also please check how the router is setup and how it translates the kirby templates to vue views if it's not clear.

Once you're satisfied with your app you run npm run build and then your kirby folder is ready to be deployed as a standalone kirby app with vue frontend.

from kirby-vue-starterkit.

george-sawdays avatar george-sawdays commented on June 10, 2024

Hi,

Ok, thanks for explaining the inject concept.

Regarding the subpage issue, when I navigate to http://localhost:3000/photography/trees for example I get 404 and the error page displays. For reference, this is my output in my terminal when I start the app in Dev mode. Could there be something wrong with the proxing?

Georges-MacBook-Pro:src georgeputnam$ npm run dev

> [email protected] dev /Users/georgeputnam/Documents/sites/noods-website/src
> nuxt

i Kirby running at: http://127.0.0.1:8000                                                   15:41:30
start Loading module                                                          nuxt:purgecss 15:41:30
ℹ PurgeCSS is not enabled because you are in dev mode                         nuxt:purgecss 15:41:30

   ╭──────────────────────────────────────────╮
   │                                          │
   │   Nuxt.js v2.12.2                        │
   │   Running in development mode (spa)      │
   │                                          │
   │   Listening on: http://localhost:3000/   │
   │                                          │
   ╰──────────────────────────────────────────╯

ℹ Preparing project for development                                                         15:41:32
ℹ Initial build may take a while                                                            15:41:32
✔ Builder initialized                                                                       15:41:32
✔ Nuxt files generated                                                                      15:41:32

I'd also like to run the project in universal mode. When I switch the app to run in that mode I get all sorts of errors pointing to the Kirby API plugin and in the page mixin. Are these part setup to run a Nuxt app in spa mode only?

from kirby-vue-starterkit.

aheadfullofcode avatar aheadfullofcode commented on June 10, 2024

Awesome. That's fixed it.

Thank you 👍

from kirby-vue-starterkit.

Related Issues (15)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.