这是我参与「第五届青训营 」伴学笔记创作活动的第 25 天
Nuxt3是可以实现SSR(Server-Side Rendering)开发的框架,使用Vue作为视图引擎。
目录结构
不用去碰的目录
.nuxt/
这个目录是创建一个Nuxt项目中初始化默认自带的一个文件夹,里面用来存放运行项目时生成的Vue的应用程序,可以不用去管它里面的文件。
.output/
这里面存放的是项目build生成的文件,不要去碰。
node_modules/
存放下载工具下载的各种依赖组件。
各种配置文件
.gitignore
如果一些目录不需要使用git管理,就把它的名称写到这里面,比如需要下载的node_modules和自动生成的.nuxt、.output就不需要放上去浪费资源。
package.json
这个文件用来选择配置项目的各个依赖。
nuxt.config.ts
.ts是它的拓展名,拓展名还可以是.js、.mjs。
这里面编写的配置用来修改Nuxt的默认配置,这位更是重量级,像是创建环境变量、修改组件导入啥的配置都是在这里编写的。
app.config.ts
创建令牌,模块热更新,各种响应式配置在这里编写。扩展名和上面一样。
components/
用来存放编写的所有Vue组件,在这里面的组件会被Nuxt自动导入可以在任何地方直接使用它。文件名默认为components/下的路径+文件名去除重读片段组成的,如果想要用文件名作为组件名需要在app.config修改。
Nuxt还支持一种动态导入或者叫惰性加载组件的方法,只需要在组件名的前面加上一个Lazy就可以了,这样组件就会在用到它的时候才进行加载。
pages/
里面存放的是各个页面组件,这些将会通过路由来进行选择。
app.vue
这个文件也是用脚手架创价的实例中默认自带的,如果没有pages/,Nuxt就不会使用路由的方式,而是着重这个文件。
plugins/
用来存放可选为被注册的插件。