Today I spent quite a lot of time researching Vue multi-page frameworks. I feel that they are quite versatile and I may use them again in the future, so I decided to organize and put it on GitHub: vue-multi-pages
Let me talk about the background and current situation.
Since Vue is originally designed for single-page applications, projects generated by vue cli are also single-page. Under the premise of single-page, many configurations are default and developers are unaware of them. However, once it becomes a multi-page application, many configurations that were hidden internally and not needed by developers before, need to be known and modified.
In addition, there is not much official guidance, and there are various versions online, making it tiring to learn and difficult to determine the best practice. It may be easier to judge if you can read more of the Vue source code, but I guess most people don't have the patience and time for that.
Technically, there are two main ways to implement it: using pages and router. The latter is essentially still a single-page application, but it appears as a multi-page application through the router, and the more thorough way is the pages approach.
I won't go into detail, experts can understand everything by looking at the code. Here are some key points:
- Supports multi-level directories
- Includes router and vuex examples
- Built-in implementation of a global 404 page
- The code does not currently include examples of private and public components, but it should be easy to implement
- Referenced vue-multiple-pages and developed on top of it
Speaking of which, I don't know if Vue 3 will have better native support for multi-page applications, looking forward to it.
Original Blog Post: 0226 - Open Sourced My Own Vue Multi-Page Framework