NUXT优点:
1nuxtjs服务端SEO
2加载快:普通页面先加载页面,如果有ajax需要又请求一次服务器
3.nuxtjs不用手动设置路由,直接在服务端渲染成静态页面
4.about 页面种,添加路由组件链接
params传参:news
news页面中{{$route.params.xxid}}
动态路由:
validate({params}){
console.log(params.id)
return params.id ===‘9527’ //如果返回非9527,就跳到404页面
}
基于 Vue.js
自动代码分层
服务端渲染
强大的路由功能,支持异步数据
静态文件服务
ES6/ES7 语法支持
打包和压缩 JS 和 CSS
HTML头部标签管理
本地开发支持热加载
集成ESLint
支持各种样式预处理器: SASS、LESS、 Stylus等
安装步骤:
npm i -g create-nuxt-app //全局安装工具
1、npx create-nuxt-app study-nuxt //创建文件
nuxt.config.js
2、可以配置全局的meta,link,title, cs,modules,proxy等
3、自动生成路由
遇到的问题和解决方法:
首页白屏
最后只能把首页内的代码作为一个组件引入首页 就解决了…
window not find
因为是服务器端渲染所以没有windows,document
解决方法 把windows放到mounted中就好 尽量少用windows