Problem description:
After writing a page in Vue scaffolding, I deployed it to a background project, because I was working on a page that would normally run on a server anyway, and I tested it in my own Node environment. It runs on my classmate’s SpringBoot, but when I put it on a big company project, I have a problem. I can only load the header, and everything else disappears
Identify the problem
F12
I checked the interface structure on F12, and found that the contents of the file app. vue were loaded, while other components and other things were not.
Needs to be rewritten
I had to rewrite it again, this time without scaffolding, just like jquery, and directly introduce CND. This way, it doesn’t need to compile, so it’s easy to publish, but it needs to configure everything by myself. I’m not very familiar with this way of writing
Start refactoring
Start from 0, and first write index.html as the entry file. When I was going to copy the scaffold entry file, I found that there was a file in app.vue<router-View/>
This is for rendering the route, the interface of the route is there<router-View>This tag loads inside
But when I look at the elements in F12, that’s exactly what’s missing
routing
Then I put the<router-View>Files that need to be rendered are directly replaced to<router-View>The location of the
So my program has no default route, I asked the management background classmate: “do you have a route for this project? Is the routing structure a problem? “At first I thought it was a background routing problem, but now it seems to be me.
Because I’m using the default route for scaffolding, and I’m just developing one of the interfaces for this project,
So when the service program recognizes the route, it can’t recognize my default route, because I’m not the default route in other people’s project, I’m just a child route, but in my own program, I’m the default route, so there’s a rendering problem between routes
conclusion