Vue JS Search Engine Optimization – SEO
After the traditional vue is built through the vue-cli scaffolding, it needs to be packaged and generated through npm run build to generate the final HTML code to be put online.
Single-page projects built by vue have various advantages, such as easy maintenance, concise code, good development experience, and so on. But for some traditional Internet companies, a very fatal problem with vue single page is the problem of SEO optimization. Below is the code of the normally packaged vue single page directory and index.html. App SEO Vancouver
There is only one index.html file in the directory – no content in this html file. There is only one div with the id of app to mount the vue instance.
Google search engine support single-page information crawling very well, but Google is a foreign domestic use to overcome the wall so it is not considered. Baidu is the main domestic search engine, and Baidu cannot crawl single-page data. If your project is online, it is difficult to find this project when others search on Baidu. Since most of my current company’s projects require SEO optimization.
Steps: JS SEO Services Richmond
- install puppeteer on npm
- The directory structure of npm builds after packaging, as well as the index.html code of each folder. The HTML code now has the template-related code in the .vue file, but there is one more problem. The index.html code in each folder references all js and CSS files, which is not conducive to SEO.
- Minimize Webpack: minChunkSize:10000
- restart the npm
We all got set. SEO on Html pages via JS