Nuxt.js项目安装和目录介绍

喜你入骨 提交于 2020-12-17 14:53:22

一 Nuxt.js环境初始化

1 解压

解压 guli_site

2 端口修改

项目默认3000端口启动,如果想要修改Nuxt.js的启动端口,则可以在package.json文件中添加如下配置

"config": {
  "nuxt": {
    "host": "127.0.0.1",
    "port": "3333"
  }
}

3 安装依赖

npm install

4 运行项目

npm run dev

二 页面布局结构

1 布局组件

页头和页尾提取出来,形成布局页

2 布局文件

layouts目录下default.vue,引用布局组件

<nuxt />:主内容占位符

3 首页面

pages/index.vue,默认使用layouts目录下default.vue布局文件

index.vue中的页面内容会被自动嵌入到模板文件的 <nuxt/> 的位置

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!