这是我参与「第五届青训营 」笔记创作活动的第14天。
Nuxt.js 是什么？
Nuxt.js 是一个基于 Vue.js 的通用应用框架。 通过对客户端/服务端基础架构的抽象组织，Nuxt.js 主要关注的是应用的 UI 渲染。 我们的目标是创建一个灵活的应用框架，你可以基于它初始化新项目的基础结构代码，或者在已有 Node.js 项目中使用 Nuxt.js。 Nuxt.js 预设了利用 Vue.js 开发服务端渲染的应用所需要的各种配置。 除此之外，我们还提供了一种命令叫：nuxt generate ，为基于 Vue.js 的应用提供生成对应的静态站点的功能。 我们相信这个命令所提供的功能，是向开发集成各种微服务（Microservices）的 Web 应用迈开的新一步。 作为框架，Nuxt.js 为 客户端/服务端 这种典型的应用架构模式提供了许多有用的特性，例如异步数据加载、中间件支持、布局支持等
特性
- 基于 Vue.js
- Vue、Vue Router、Vuex、Vue SSR
- 自动代码分层
- 服务端渲染
- 强大的路由功能，支持异步数据
- 静态文件服务
- ES2015+ 语法支持
- 打包和压缩 JS 和 CSS
- HTML 头部标签管理
- 本地开发支持热加载
- 集成 ESLint
- 支持各种样式预处理器： SASS、LESS、 Stylus 等等
- 支持 HTTP/2 推送
创建项目
- Nuxt 提供了两种方式用来创建项目：使用 create-nuxt-app 脚手架工具
目录结构讲解
- .nuxt 里面是放置 nuxt 项目的配置信息，最好不要动
- assets 会放置一些静态资源，如 js 文件，SASS，LESS 文件等；
- components 专门放置页面中的组件；
- layouts 专门放置项目的模板；
- middleware 专门放置项目的中间件；
- pages 专门放置项目的页面；
- plugins 专门放置项目的插件；
- static 主要放置项目的静态资源，如图片；
- store 用于项目的 vuex 状态文件；
- nuxt.config.js 项目的配置文件，比较重要；
- package.json 里面主要是项目的依赖关系；
