-
3-nuxt.config.js配置文件
-
build和generate的区别
-
generate特点：
- 1-使用generate打包后每个对应的页面都会生成一个html，你在打包的时候不能关闭后台，他会请求后台数据生成首屏的数据
- 2-这样打包有一个弊端，当你首屏的数据发生更改的时候，他还是显示的是之前的数据，要想改变的话，需要重新打包发布才行。
- 3-所以，如果你的首屏是动态的就不建议使用这种打包方式了。
- 4-打包之后每个页面都生成了HTML页面，只有首屏的数据是之前渲染好了，但是其它数据还是从后台获取，比如翻页，第二页数据是重新请求后台的，你再次返回第一页也是再次请求的。
-
build特点：
- 1-build打包生成的是动态页面，当然是同样具有SEO功能。
-
发布的区别：
-
generate发布
- 打包方式简单，执行npm run dev会生成dist文件夹，放到服务器就好了。
-
build发布
- build打包方式比较复杂，执行npm run build命令。
- 服务器需要安装node，但node版本还不能过高，过高会有问题。
- 执行命令之后需要把下面这几个文件/文件夹放到服务器上 .nuxt / static / nuxt.config.js /package.json
-
-
额外记录
-
在nuxt中使用generate批量生成静态站点页面
- 做过seo的同学都知道，一些不是实时变化的页面（比如一个星期更新一次内容）我们可以生成静态的站点去让爬虫去爬去，这样就无需一次次地调用接口了。
-
-
generate的配置
- dir：我们生成的静态文件的目录，
- concurrency：我们在批量生成文件的时候一次产生的文件数量，
- interval：批量生成文件间隔，
- crawler：比如我们的页面中有a链接的话，会生成a链接指向的页面的静态页面（早期版本没有提供这个属性），
- routes：我们想要生成静态页面对应的vue文件路由，它返回一个数组对象
-
-
基本配置项
- mode开发模式：universal（每个页面都有url）、SPA（单页面应用）
-
build配置打包
-
用于Nuxt.js 允许你在自动生成的 vendor.bundle.js 文件中添加一些模块，以减少应用 bundle 的体积。如果你的应用依赖第三方模块，这个配置项是十分实用的
- 比如，可以添加babel编译工具，转换语法
-
-
css配置全局css样式导入
- 该配置项用于定义应用的全局（所有页面均需引用的）样式文件、模块或第三方库
-
dev
- 该配置项用于配置 Nuxt.js 应用是开发还是生产模式
-
env
- 该配置项用于定义应用客户端和服务端的环境变量
-
generate配置开发模式
- 该配置项用于定义每个动态路由的参数，Nuxt.js 依据这些路由配置生成对应目录结构的静态文件
-
head自定义HTML模板
-
该配置项用于配置应用默认的 meta 标签
- title页面标题
-
meta自定义头部
- hid设置唯一标识（同名覆盖），name，content
- link以link的方式使用外部资源文件
-
-
loading进行AJAX请求时顶部进度条的颜色
- 该配置项用于个性化定制 Nuxt.js 使用的加载组件
-
modules模块拓展
-
该配置项允许您将 Nuxt 模块添加到项目中
- '@ nuxtjs/xxx'
- 再xxx:{......}单独配置xxx模块
-
-
modulesDir
- 该配置项允许您定义Nuxt.js应用程序的node_modules文件夹
- devModules开发模式的模块，如eslint
-
plugins配置第三方插件
- 配置那些需要在 根vue.js应用 实例化之前需要运行的 Javascript 插件
-
rootDir
- 该配置项用于配置 Nuxt.js 应用的根目录
-
router
- 该配置项可用于覆盖 Nuxt.js 默认的 vue-router 配置
-
server
- 此选项允许您配置 Nuxt.js 应用程序的服务器实例变量
-
srcDir
- 该配置项用于配置应用的源码目录路径
-
dir
- 此选项允许您配置 Nuxt.js 应用程序的自定义目录
-
transition
- 该配置项用于个性化配置应用过渡效果属性的默认值
-
