{"id":13498583,"url":"https://github.com/serverless-components/tencent-nuxtjs","last_synced_at":"2025-10-15T03:29:44.600Z","repository":{"id":43279596,"uuid":"244077037","full_name":"serverless-components/tencent-nuxtjs","owner":"serverless-components","description":"Tencent Cloud Nuxt.js Serverless Component","archived":false,"fork":false,"pushed_at":"2022-03-10T08:54:03.000Z","size":190,"stargazers_count":13,"open_issues_count":1,"forks_count":4,"subscribers_count":8,"default_branch":"master","last_synced_at":"2025-03-18T05:59:06.258Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/serverless-components.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-03-01T03:00:19.000Z","updated_at":"2023-02-25T19:00:14.000Z","dependencies_parsed_at":"2022-08-29T01:11:04.471Z","dependency_job_id":null,"html_url":"https://github.com/serverless-components/tencent-nuxtjs","commit_stats":null,"previous_names":[],"tags_count":13,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/serverless-components%2Ftencent-nuxtjs","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/serverless-components%2Ftencent-nuxtjs/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/serverless-components%2Ftencent-nuxtjs/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/serverless-components%2Ftencent-nuxtjs/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/serverless-components","download_url":"https://codeload.github.com/serverless-components/tencent-nuxtjs/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247202992,"owners_count":20900887,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-07-31T21:00:37.215Z","updated_at":"2025-10-15T03:29:39.559Z","avatar_url":"https://github.com/serverless-components.png","language":"JavaScript","readme":"⚠️⚠️⚠️ 所有框架组件项目迁移到 [tencent-framework-components](https://github.com/serverless-components/tencent-framework-components).\n\n[![Serverless Nuxtjs Tencent Cloud](https://img.serverlesscloud.cn/2020310/1583829094342-nuxt.js%20_%E9%95%BF.png)](http://serverless.com)\n\n# 腾讯云 Nuxt.js Serverless Component\n\n## 简介\n\n**腾讯云[Nuxt.js](https://github.com/nuxt/nuxt.js)组件** - 通过使用[**Tencent Serverless Framework**](https://github.com/serverless/components/tree/cloud) , 基于云上 Serverless 服务（如 API 网关、云函数等），实现“0”配置，便捷开发，极速部署采用 Nuxt.js 框架的网页应用，Nuxt.js 组件支持丰富的配置扩展，提供了目前便捷实用，开发成本低的网页应用项目的开发/托管能力。\n\n特性介绍：\n\n- [x] **按需付费** - 按照请求的使用量进行收费，没有请求时无需付费\n- [x] **\"0\"配置** - 只需要关心项目代码，之后部署即可，Serverless Framework 会搞定所有配置。\n- [x] **极速部署** - 部署速度快，仅需几秒，部署你的整个应用。\n- [x] **实时日志** - 通过实时日志的输出查看业务状态，便于直接在云端开发应用。\n- [x] **云端调试** - 可在云端直接进行项目调试，从而避免本地环境的差异。\n- [x] **便捷协作** - 通过云端控制台的状态信息和部署日志，方便进行多人协作开发。\n\n## 快速开始\n\n0. [**准备**](#0-准备)\n1. [**安装**](#1-安装)\n1. [**配置**](#2-配置)\n1. [**部署**](#3-部署)\n1. [**开发调试**](#4-开发调试)\n1. [**查看状态**](#5-查看部署状态)\n1. [**移除**](#6-移除)\n\n更多资源：\n\n- [**账号配置**](#账号配置)\n- [**更多组件**](#更多组件)\n- [**FAQ**](#FAQ)\n\n### 1. 安装\n\n通过 npm 全局安装 [serverless cli](https://github.com/serverless/serverless)\n\n```bash\n$ npm install -g serverless\n```\n\n### 2. 创建\n\n通过如下命令和模板链接，快速创建一个 nuxtjs 应用：\n\n```bash\n$ serverless init nuxtjs-starter --name example\n$ cd example\n```\n\n### 3. 部署\n\n在 `serverless.yml` 文件所在的项目根目录，运行以下指令，将会弹出二维码，直接扫码授权进行部署：\n\n```\nserverless deploy\n```\n\n\u003e **说明**：如果鉴权失败，请参考 [权限配置](https://cloud.tencent.com/document/product/1154/43006) 进行授权。\n\n### 4. 配置\n\nnuxtjs 组件支持 0 配置部署，也就是可以直接通过配置文件中的默认值进行部署。但你依然可以修改更多可选配置来进一步开发该 nuxtjs 项目。\n\n以下是 nuxtjs 组件的 `serverless.yml`配置示例：\n\n```yml\n# serverless.yml\ncomponent: nuxtjs # (必填) 组件名称，此处为nuxtjs\nname: nuxtjsDemo # (必填) 实例名称\norg: orgDemo # (可选) 用于记录组织信息，默认值为您的腾讯云账户 appid\napp: appDemo # (可选) 该 nuxt.js 项目名称\nstage: dev # (可选) 用于区分环境信息，默认值是 dev\n\ninputs:\n  src:\n    src: ./\n    exclude:\n      - .env\n  region: ap-guangzhou\n  runtime: Nodejs10.15\n  apigatewayConf:\n    protocols:\n      - http\n      - https\n    environment: release\n```\n\n- 点此查看[更多配置及说明](https://github.com/serverless-components/tencent-nuxtjs/tree/master/docs/configure.md)\n\n### 4. 开发调试\n\n部署了 Nuxt.js 应用后，可以通过开发调试能力对该项目进行二次开发，从而开发一个生产应用。在本地修改和更新代码后，不需要每次都运行 `serverless deploy` 命令来反复部署。你可以直接通过 `serverless dev` 命令对本地代码的改动进行检测和自动上传。\n\n可以通过在 `serverless.yml`文件所在的目录下运行 `serverless dev` 命令开启开发调试能力。\n\n`serverless dev` 同时支持实时输出云端日志，每次部署完毕后，对项目进行访问，即可在命令行中实时输出调用日志，便于查看业务情况和排障。\n\n### 5. 查看部署状态\n\n在`serverless.yml`文件所在的目录下，通过如下命令查看部署状态：\n\n```\n$ serverless info\n```\n\n### 6. 移除\n\n在`serverless.yml`文件所在的目录下，通过以下命令移除部署通过以下命令移除部署的 API 网关，移除后该组件会对应删除云上部署时所创建的所有相关资源。\n\n```bash\n$ serverless remove\n```\n\n和部署类似，支持通过 `serverless remove --debug` 命令查看移除过程中的实时日志信息，`serverless`是 `serverless` 命令的缩写。\n\n### 账号配置\n\n当前默认支持 CLI 扫描二维码登录，如您希望配置持久的环境变量/秘钥信息，也可以本地创建 `.env` 文件\n\n```bash\n$ touch .env # 腾讯云的配置信息\n```\n\n在 `.env` 文件中配置腾讯云的 SecretId 和 SecretKey 信息并保存\n\n如果没有腾讯云账号，可以在此 [注册新账号](https://cloud.tencent.com/register)。\n\n如果已有腾讯云账号，可以在 [API 密钥管理](https://console.cloud.tencent.com/cam/capi) 中获取 `SecretId` 和`SecretKey`.\n\n```text\n# .env\nTENCENT_SECRET_ID=123\nTENCENT_SECRET_KEY=123\n```\n\n\u003e 注意：海外 ip 登录时，需要在`.env`文件中添加`SERVERLESS_PLATFORM_VENDOR=tencent` ，使 serverless 默认使用 tencent 组件\n\n## 更多组件\n\n可以在 [Serverless Components](https://github.com/serverless/components) repo 中查询更多组件的信息。\n\n## 项目迁移\n\n如果项目使用了自定义 Node.js 服务，比如 express 或者 koa，你需要做如下改造工作。\n\n### 自定义 express 服务\n\n如果你的 Nuxt.js 项目本身运行就是基于 `express` 自定义服务的，那么你需要在项目中自定义入口文件 `sls.js`，需要参考你的服务启动文件进行修改，以下是一个模板文件：\n\n```js\nconst express = require('express')\nconst { loadNuxt } = require('nuxt')\n\nasync function createServer() {\n  // not report route for custom monitor\n  const noReportRoutes = ['/_nuxt', '/static', '/favicon.ico']\n\n  const server = express()\n  const nuxt = await loadNuxt('start')\n\n  server.all('*', (req, res, next) =\u003e {\n    noReportRoutes.forEach((route) =\u003e {\n      if (req.path.indexOf(route) === 0) {\n        req.__SLS_NO_REPORT__ = true\n      }\n    })\n    return nuxt.render(req, res, next)\n  })\n\n  // define binary type for response\n  // if includes, will return base64 encoded, very useful for images\n  server.binaryTypes = ['*/*']\n\n  return server\n}\n\nmodule.exports = createServer\n```\n\n### 自定义 koa 服务\n\n如果你的项目使用的是 Koa 作为 Node.js 服务，需要在项目中自定义入口文件 `sls.js`，需要参考你的服务启动文件进行修改，以下是一个模板文件：\n\n```js\nconst Koa = require('koa')\nconst { loadNuxt } = require('nuxt')\n\nasync function createServer() {\n  const server = new Koa()\n  const nuxt = await loadNuxt('start')\n\n  server.use((ctx) =\u003e {\n    ctx.status = 200\n    ctx.respond = false\n    ctx.req.ctx = ctx\n\n    nuxt.render(ctx.req, ctx.res)\n  })\n\n  // define binary type for response\n  // if includes, will return base64 encoded, very useful for images\n  server.binaryTypes = ['*/*']\n\n  return server\n}\n\nmodule.exports = createServer\n```\n\n## 自定义监控\n\n\u003e **目前仅支持自定义 `Express` 服务的项目**\n\n当在部署 Nuxt.js 应用时，如果 `serverless.yml` 中未指定 `role`，默认会尝试绑定 `QCS_SCFExcuteRole`，并且开启自定义监控，帮助用户收集应用监控指标。对于为自定义入口文件的项目，会默认上报除含有 `/_nuxt`、`/static` 和 `/favicon.ico` 的路由。如果你想自定义上报自己的路由性能，那么可以自定义 `sls.js` 入口文件，对于无需上报的路由，在 express 服务的 `req` 对象上添加 `__SLS_NO_REPORT__` 属性值为 `true` 即可。比如：\n\n```js\nserver.get('/no-report', (req, res, next) =\u003e {\n  req.__SLS_NO_REPORT__ = true\n  return nuxt.render(req, res, next)\n})\n```\n\n那么用户在访问 `GET /no-report` 路由时，就不会上报自定义监控指标。\n\n## 文件上传\n\n[文件上传教程](https://github.com/serverless-components/tencent-nuxtjs/tree/master/docs/upload.md)\n\n## License\n\nMIT License\n\nCopyright (c) 2020 Tencent Cloud, Inc.\n","funding_links":[],"categories":["组件"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fserverless-components%2Ftencent-nuxtjs","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fserverless-components%2Ftencent-nuxtjs","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fserverless-components%2Ftencent-nuxtjs/lists"}