基于Vue的通用框架Nuxt.js

转载自:www.weidianyuedu.com/content/2614568140506.html

相信很多使用Vue的小伙伴们一样疑惑这个问题,其实从这个问题就可以知道你对Vue这个框架是否真的熟悉了。其实单单使用Vue这个框架来做官网的,其实是不友好的,非常不利于SEO,抓取。因为Vue是通过把你的代码编译的,生成是SPA,里面的html其实是空的,Nuxt.js属于SSR,也就是服务器渲染。Nuxt.js打包生成的每个路由都会对应相对的html文件。有利于网站抓取,SEO。

Vue适合做对seo无关紧要的项目,别的项目不适合,但是Nuxt.js 正好就修补了Vue的这个缺陷。

官方解析:

Nuxt.js环境搭建和创建启动项目

做vue的小伙伴都知道vue-cli脚手架,其实vue-cli已经集成了nuxt.js,所以直接使用vue-cli就可以直接构建Nuxt.js项目了。直接在需要创建项目的路径新建文件夹,文件夹名为项目名称,其实就是和创建vue项目一样。然后在该文件下打开cmd,然后运行下面cmd命令

vue init nuxt/starter

成功创建如下图所示:

然后使用

npm install

下载依赖项,运行项目

npm run dev

此时项目已经运行成功,并且默认在3000端口打开。

浏览器预览:

很高兴告诉你,此时Nuxt.js项目已经创建并且启动成功。

Nuxt.js

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值