NUXT.js 笔记 - nuxt.config.js

这一章会大概介绍一下nuxt.config.js的一些设定与用法，并不一定完全详细，主要会着重在自己有实际应用到的内容，那就开始吧。

mode

这里会有两个参数，分别为 spa 与 universal 主要差别在于是否有SSR(server-side rendering)，而这边要注意一下是在**spa模式下是没有SSR的**，而预设的universal才是有支援SSR的，虽然目前测试起来我还是感觉不太到两者最大差异在哪，若之后有所发现在会补上

head

使用的是vue-meta所以使用方式，如官方文件一样，而在这边设定是设定所有页面的default，若后续需要个别设定时也可以在各页面中自行设定，这部分在后面的router章节会在补充说明。

transition、layoutTransition

页面切换时的过渡动画设定，可设定的参数与vue的transition标籤相同，这边要注意下若页面的切换过程中，若有更换到layout，并不会执行此设定，而是会使用layoutTransitio，至于何为layout后续会有更详细的说明，这边你可以当作是各页面中外层的共用模板。

loading

nuxt他有预设的过渡动画，但也可以透过此设定自行修改，可以直接修改使用自行开发的component，也可只是很单纯的设定css来更换风格，若是用component你可以methods中宣告start()、finish()、fail()、increase(num)，可提供给其他的component使用

css

可在此设定全域使用的css file

plugins

可自行引入所需的JavaScript plugin，且可自行定义是否要只行 server-side render，最常见的是某些plugin会使用到 window 的功能，此类别的功能在server-side是无法执行的，所以此时就需要将 ssr 设定为 false

modules

可是设定额外再附加的module，较常使用的有@nuxtjs/axios，也可另外对此module做options设定

router

里面的设定参数都很单纯官方(https://nuxtjs.org/api/configuration-router)也说的蛮清楚的，不过这边要特别提一下middlewar，这参数我们会在后续的文章中详细介绍