入门

5 分钟上手:从零到上线

这篇教程带你用 5 步做出一个能正式上线的网站:生成站点、本地安装、改成你的内容、加一个插件、部署到 Cloudflare。每一步大约 1 分钟(首次安装依赖视网速而定)。

准备:Node.js 22+、pnpm 10;部署到 Cloudflare 需要一个 Cloudflare 账号(免费版即可)。框架以源码授权交付,详见 定价。

第 1 步:生成站点(约 1 分钟)

npx -y https://insightme.top/create-nuxtcms.tgz my-site

按提示选择模板(企业官网、博客资讯、文档站免费;也可以加 --template corporate 直接指定,--list 查看全部)。生成的项目已经包含依赖配置、样式、中英双语文案、.env(随机生成的密钥)和 Cloudflare 部署配置。

第 2 步:本地安装(约 1 分钟)

cd my-site
pnpm install
pnpm dev

打开 http://localhost:3000/zh/setup:

  1. 填写站点名称和管理员邮箱、密码;
  2. 保留「导入演示内容」,会写入一套中英双语的示例文章、产品和页面;
  3. 点击安装,自动登录并进入后台 /zh/admin。

开发环境默认使用 SQLite 文件(.data/),不需要安装数据库。

第 3 步:改成你的网站(约 1 分钟)

在后台依次完成:

  • 设置:站点名称、Logo、联系方式;
  • SEO 设置:标题、描述、关键词(每种语言分别填写),sitemap、hreflang、llms.txt 会自动生成;
  • 文章 / 页面:写第一篇文章,可以填写将来的时间定时发布;每次保存前的版本都会保留,可随时恢复;
  • 右上角菜单 → 账户安全:开启两步验证(见 后台账户安全)。

前台页面在 app/pages/ 下,想改哪个页面就在站点里放一个同路径的文件,其余页面继续沿用框架。

第 4 步:加一个插件(约 1 分钟)

在线插件:后台 → 插件 → 插件市场,免费插件点击安装即可使用,不需要重新构建。

官方功能插件(商城、SaaS 套件、AI 助手、区块页面搭建、营销工具、博客增强)随框架发布,用一条命令添加,例如营销工具(候补名单、更新日志、反馈投票、法律页面):

pnpm plugin add marketing
pnpm dev

重启后在 后台 → 插件 中启用「营销工具」,后台出现「营销」菜单,/zh/waitlist、/zh/changelog、/zh/feedback 页面即可访问。各插件说明见 插件。

第 5 步:部署到 Cloudflare(约 1 分钟)

cp .cloudflare.env.example .cloudflare.env   # 填写 CLOUDFLARE_API_TOKEN 与 CLOUDFLARE_ACCOUNT_ID
pnpm deploy:init                             # 创建 D1 数据库、R2 存储、Pages 项目并设置密钥
pnpm deploy:migrate                          # 数据库迁移 + 构建 + 发布

API 令牌需要 D1、R2、Pages 的编辑权限(在 Cloudflare 控制台「我的个人资料 → API 令牌」创建)。完成后打开 https://my-site.pages.dev/zh/setup,用同样的方式创建线上管理员;没有服务器需要维护,数据库是 D1,附件存在 R2。

公网站点建议先设置安装令牌 NUXT_SETUP_TOKEN(pnpm exec wrangler pages secret put NUXT_SETUP_TOKEN --project-name my-site,再运行一次 pnpm deploy:migrate),安装向导会要求填写它,防止别人抢先安装。

绑定自己的域名:Cloudflare 控制台 → Pages 项目 → 自定义域。有多个域名时,在后台「跳转管理 → 域名跳转」把其他域名统一跳到主域名,见 跳转管理。

不用 Cloudflare?同一份代码可以部署到宝塔 / Nginx、Docker、Vercel、Netlify、阿里云、腾讯云等,见 部署指南。

接下来

  • 定时任务(定时发布兜底、插件任务、自动清理):部署 deploy/cron-worker,见 运维与安全;
  • 已有 WordPress 站点:导入 WXR 导出文件,见 从 WordPress 迁移;
  • 做 SaaS 产品:SaaS 套件(账户、订阅收款、积分、API 密钥、团队);
  • 框架升级:改一个版本号,运行 npx nuxtcms doctor 检查你覆盖过的文件,见 快速开始;
  • 和 ShipFast、WordPress 等方案的对比:https://insightme.top/zh/compare。