In the project built by vue+typescript, the routing is loaded lazily, the development environment is running normally, and the white screen is displayed on the server page when deployed.

problem description

add routing lazy loading, the development environment is running normally, deploy to the server the page displays a white screen

the environmental background of the problems and what methods you have tried

vue+typescript builds a project and adds routing lazy loading. After deployment to the server, there is no error message in the console.
1. The path problem was suspected at first. By consulting the relevant developer"s documentation, the assetsPublicPath in index.js under config was changed to. /, which could not solve
2. Since there is no error message, the reason for the white screen is verified step by step through the simplest demo. The verification process is as follows:
1, the simplest demo
const Home= () = > import ("@ / components/Home.vue")
clipboard.png

ts
clipboard.png


clipboard.png

:

clipboard.png

1.demosrc/routerindex.ts
clipboard.png
2.config/index.jsindex.htmlbuildassetsPublicPath/./
clipboard.png
3. Then package and deploy to the server to see if the screen is blank

what result do you expect? What is the error message actually seen?

look forward to the result. Add routing lazily loaded. After packaging and deployment, the page will display normally. In fact, there is no error message after deployment.
I don"t know how to locate the problem. Please give me some advice.


the learning skill is not good, and the problem cannot be solved if there is a problem with the template. At present, vue-cli3 already supports typescript and has official maintenance. The above problems took a lot of effort and were eventually migrated to the latest cli3 through the project, thus being solved.

Menu