Nuxt服务端渲染-Json-server api服务搭建

客官°小女子只卖身不卖艺 2022-10-17 05:56 100阅读 0赞

[https://github.com/typicode/json-server\#paginate][https_github.com_typicode_json-server_paginate]

首先全局安装

cnpm install json-server -g
    // mac下执行
    sudo cnpm install json-server -g

在目录下创建一个server文件夹，将data.json文件放在里面

{
      "posts": [
        { "id": 1, "title": "json-server", "author": "typicode" }
      ],
      "comments": [
        { "id": 1, "body": "some comment", "postId": 1 }
      ],
      "profile": { "name": "typicode" }
    }

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3h5cGhm_size_16_color_FFFFFF_t_70][]

cd server 进入server文件夹

执行下列命令

json-server --watch data.json --port 3002

数据启动成功

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3h5cGhm_size_16_color_FFFFFF_t_70 1][]

[http://localhost:3002/jokes?\_page=2&\_limit=5][http_localhost_3002_jokes_page_2_limit_5] 表示第2页，一页5条

http://localhost:3002/jokes?&q=why 表示查询why这个字段

这说明接口已经可以使用了

[https_github.com_typicode_json-server_paginate]: https://github.com/typicode/json-server#paginate
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3h5cGhm_size_16_color_FFFFFF_t_70]: /images/20221014/2422db6dc0fe437a8b9c167257b2d3dd.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3h5cGhm_size_16_color_FFFFFF_t_70 1]: /images/20221014/4c3bcfe22a0047eb8648ed6b713271dd.png
[http_localhost_3002_jokes_page_2_limit_5]: http://localhost:3002/jokes?_page=2&_limit=5

发表评论取消回复

表情：

评论列表（有 0 条评论，100人围观）

还没有评论，来说两句吧...

相关阅读

相关服务端渲染技术NUXT

服务端渲染又称SSR (Server Side Render)是在服务端完成页面的内容，而不是在客户端通过AJAX获取数据。服务器端渲染(SSR)的优势主要在于：更好的 S

爱被打了一巴掌/ 2023年10月14日 18:49/ 0 赞/ 137 阅读

相关 Nuxt服务端渲染-命令和列表

<table style="width:500px;"> <tbody> <tr> <td>命令</td> <td>描述</td> </tr>

小灰灰/ 2022年10月17日 10:48/ 0 赞/ 302 阅读

相关 Nuxt服务端渲染-接口服务端渲染

在server里面启动server-api服务后再起一个命令行窗口，再npm run dev启动项目服务先安装axios cnpm install axios -

心已赠人/ 2022年10月17日 05:59/ 0 赞/ 339 阅读

相关 Nuxt服务端渲染-Json-server api服务搭建

[https://github.com/typicode/json-server\paginate][https_github.com_typicode_json-server

客官°小女子只卖身不卖艺/ 2022年10月17日 05:56/ 0 赞/ 101 阅读

相关 Nuxt服务端渲染-nuxt.config.js配置介绍

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3h5cGhm

超、凢脫俗/ 2022年10月16日 15:30/ 0 赞/ 346 阅读

相关 Nuxt服务端渲染- Nuxt目录解释

.nuxt assets 包含一些未编译的静态资源，包括LESS、SASS、JS、icon图片等 components vue组件存放目录 lay

悠悠/ 2022年10月16日 15:30/ 0 赞/ 388 阅读

相关 Nuxt服务端渲染-create-nuxt-app的安装和使用

执行 cnpm init -y 执行 cnpm install create-nuxt-app --save-dev 调用一下create-nuxt-a

我不是女神ヾ/ 2022年10月16日 15:28/ 0 赞/ 381 阅读

相关前端nuxt服务端渲染打包以及后台启动

1.到local磁盘下 cd /usr/local 2. 安装nodejs wget https://nodejs.org/dist/v8.9.1/nod

太过爱你忘了你带给我的痛/ 2022年05月27日 10:46/ 0 赞/ 592 阅读

相关 TypeScript + Webpack + Koa 搭建 React 服务端渲染

原理： 1. 利用 webpack 打包能在 node 运行的 React 代码，利用 `react-dom/server` 将 React 代码渲染成 html 字符

素颜马尾好姑娘i/ 2022年04月27日 23:06/ 0 赞/ 468 阅读

相关 Vue.js 服务端渲染Nuxt.js

官网：[https://zh.nuxtjs.org/guide][https_zh.nuxtjs.org_guide] [https_zh.nuxtjs.org_guide

╰+攻爆jí腚メ/ 2022年04月24日 15:02/ 0 赞/ 321 阅读