vue这种没有啥好的办法,要么在服务端解析,要么在客户端解析,前端node方式nuxt比较成熟。
1、使用类似MVC框架:将vue的组件打包成一个库,后端使用比如asp.net,只需要引入这个静态库就好,比如引入自定义组件标签<Post></Post>,组件不会涉及内容,自然SEO也不会影响,早年我试过这种方案,效果还不错。
2、单独的SEO服务器:nuxt的后端性能实在不敢恭维,这里提供一个思路,单独备一台nuxt服务器用于SEO,将爬虫的流量透过来,这种效果也是蛮好的。
方便留个联系方式么 ,请付费交给你帮忙。
对于需要收录的,只能SSR
除了使用Nuxt.js,您还可以采用以下方法来优化Vue.js应用程序的SEO:
1、使用Prerender SPA Plugin:这是一个webpack插件,它可以在构建过程中预先渲染单页面应用程序(SPA)的路由。这样,搜索引擎就可以轻松获取到静态HTML内容。要使用此插件,请先安装它:
npm install prerender-spa-plugin --save-dev
然后在webpack配置文件中添加以下内容:
const PrerenderSPAPlugin = require('prerender-spa-plugin');
module.exports = {
// ...
plugins: [
// ...
new PrerenderSPAPlugin({
staticDir: path.join(__dirname, 'dist'),
routes: ['/', '/about', '/contact'], // 预渲染的路由列表
}),
],
};
2、使用Vue Press:Vue Press是一个为Vue.js项目设计的静态站点生成器。它最初是为编写技术文档而开发的,但也可以用于创建博客、网站等其他类型的静态站点。Vue Press会自动为您的页面生成静态HTML内容,从而提高SEO性能。要使用Vue Press,请按照以下步骤操作:
npm install -g vuepress
然后,在项目根目录下创建一个名为.vuepress的文件夹,并在其中添加一个config.js文件。接下来,您可以按照Vue Press的文档配置您的站点。
3、手动创建静态页面:如果您不想使用Nuxt.js或Vue Press,您可以选择手动创建静态页面。这意味着您需要为每个页面创建一个单独的HTML文件,并在其中嵌入Vue.js应用程序。这样,搜索引擎可以直接抓取静态HTML内容。但是,这种方法可能会导致维护困难,尤其是在项目较大时。
html加meta标签有助于seo
<meta name="description" content="页面内容的简短描述">
<meta name="keywords" content="关键词1, 关键词2, 关键词3">