nuxt.js特性

68 阅读1分钟

nuxt自动将pages目录下的vue文件编译成路由,将static目录下的文件直接复制到输出目录;

如果要取代nuxt自己生成的路由,如下:

export const $routes = [//自配置路由

{

​ path: '/',

​ name: 'Home',

​ component: resolve('pages/index/Index.vue'),//nuxt默认路由懒加载

​ meta: {

​ title: '首页',

​ }

}]

const extendRoutes = (routes) => {

routes.length = 0 // 清除 nuxt 自己生成的路由,这里不要用 空数组 赋值

routes.push(...$routes)

}

状态管理

store文件下的文件夹会自动认定为状态模块;

支持中间件,可以在路由处理前后执行操作,比如验证用户身份,记录日志;(相当于vue中的守卫)

提供插件系统,方便集成三方库,比如Axios/eleUI

自动导入:component组件自动注册为全局组件,nuxt将代码划分为更小的块,可以减小js捆绑包的体积,并且能识别捆绑包中哪些是真正使用的部分,有利于treeshaking树摇删除无用代码

服务端渲染:Nuxt具备内置的服务器端渲染能力,不需要自己设置单独的服务器。

零配置ts支持

Vite热模块替换