SSR渲染--02--nuxt demo（vue）

cmd 打开命令提示符，创建nuxt

npm i create-nuxt-app -g
create-nuxt-app vue-honor-of-kings（这个是我的项目名，输入自己的项目名）
npm run dev

创建的具体配置

【写demo为了方便，我直接下载了Element的包，可以看自己的需求自己衡量】

✨  Generating Nuxt.js project in nuxt_pro
【项目名称】? Project name: nuxt_pro
【编程语言】? Programming language: JavaScript
【打包方式】? Package manager: Npm 
【UI框架】? UI framework: None 
【模板引擎】? Template engine: HTML 
【格式化空间】? Nuxt.js modules: (Press  to select,  to toggle all,  to invert selection)
【格式化空间】? Linting tools: (Press  to select,  to toggle all,  to invert selection)
【测试框架】? Testing framework: None
【渲染技术：SSR（服务端渲染）】? Rendering mode: Universal (SSR / SSG)
【开发目标】? Deployment target: Server (Node.js hosting)
【开发工具】? Development tools: (Press  to select,  to toggle all,  to invert selection)
【github 账号】? What is your GitHub username? aliyanyi
【版本控制】? Version control system: Git

页面结构

-─项目
  ├─.nuxt               // Nuxt自动生成，临时的用于编辑的文件，build
  ├─assets【主动创建】    // 用于组织未编译的静态资源如LESS、SASS或JavaScript,对于不需要通过Webpack 处理的静态资源文件，可以放置在 static 目录中
  ├─components          // 用于自己编写的Vue组件
  ├─layouts【主动创建】   // 布局目录，用于组织应用的布局组件，不可更改
  ├─node_modules
  ├─pages               // 用于组织应用的路由及视图,Nuxt.js根据该目录结构自动生成对应的路由配置，文件名不可更改
  ├─plugins             // 用于组织那些需要在根vue.js应用 实例化之前需要运行的Javascript 插件。
  ├─static              // 用于存放应用的静态文件，此类文件不会被 Nuxt.js调用 Webpack 进行构建编译处理。 服务器启动的时候，该目录下的文件会映射至应用的根路径 / 下。文件夹名不可更改。
  └─store               // 用于组织应用的Vuex 状态管理。文件夹名不可更改。
  ├─.editorconfig       // 开发工具格式配置
  ├─.eslintrc.js        // ESLint的配置文件，用于检查代码格式
  ├─.gitignore          // 配置git忽略文件
  ├─nuxt.config.js      // 用于组织Nuxt.js 应用的个性化配置，以便覆盖默认配置。文件名不可更改。
  ├─package-lock.json   // npm自动生成，用于帮助package的统一设置的，yarn也有相同的操作
  ├─package.json        // npm 包管理配置文件
  ├─README.md

layouts文件下创建自定义路由 myheader.vue

【因为之前创建的时候，配置了elementU,所以我们直接使用就行】