zizther/craftcms-ddev

使用 DDEV 进行本地托管和 Vite 进行前端打包及 HMR 的 Craft CMS 入门项目。

维护者

详细信息

github.com/zizther/craftcms-ddev

源代码

问题

安装: 55

依赖者: 0

建议者: 0

安全: 0

星标: 0

关注者: 1

分支: 0

开放问题: 0

类型:项目

1.2.7 2024-06-26 16:48 UTC

MIT 2b10ae43bc794f81ecebc4b3352b0c8b0644c7a3

cmsCraftcraftcmsddev

This package is auto-updated.

Last update: 2024-09-26 17:21:11 UTC

README

使用 DDEV 进行本地托管和 Vite 进行前端打包及 HMR 的 Craft CMS 入门项目。

在新的 Craft 安装上从零开始到 Vite HMR，只需 4 个 CLI 命令

  1. composer create-project...
  2. make init
  3. make setup
  4. make dev

显著特性

本地机器要求

  1. Docker
  2. DDEV，最低版本 1.19
  3. 可选，但推荐，Composer

入门指南

选项 1：使用 Composer（推荐）

如果您在本地机器上安装了 Composer，您可以使用 create-project 命令拉取最新的标记版本。

打开终端提示符，并运行

composer create-project zizther/craftcms-ddev PATH --no-install

确保 PATH 是一个 新的 或 现有且为空的 文件夹。

选项 2：使用 Git CLI

或者您也可以通过 Git CLI 克隆仓库。 degit 是最简单的方法

degit git@github.com:zizther/craftcms-ddev.git PATH

确保 PATH 是一个 新的 或 现有且为空的 文件夹。

最后，清理并设置一些默认文件以供使用

make init

如果您使用 git clone

您可能想丢弃现有的 /.git 目录。在终端中运行

cd PATH
rm -rf .git

选项 3：手动下载

将仓库的副本下载到您的本地机器，并将其移动到您想要运行项目的位置。类似于上面，您可能还需要清理并设置一些默认文件以供使用。在终端中运行

make init

配置 DDEV

注意：本节是可选的。如果您只是测试该项目，请自由跳到下一节。⚡

要配置项目以在除 https://craftcms.test 之外的其他域上运行，请运行

ddev config

跟随提示。

  • 项目名称：例如，mysite 将导致项目 URL 为 https://mysite.test（在安装过程中稍后注意此点）
  • Docroot 位置：默认为 web，保持不变
  • 项目类型：默认为 php，保持不变

安装 Craft

要安装一个干净的 Craft 版本，请运行

make setup

跟随提示。

此命令将

  1. 设置项目名称和域名
  2. 将您的本地 SSH 密钥复制到容器中（如果您正在设置 craft-scripts，这将很有用）
  3. 启动您的 DDEV 项目
  4. 安装 Composer
  5. 安装 npm
  6. 进行一次性的 Vite 构建
  7. 生成 CRAFT_APP_ID 并保存到您的 .env 文件中
  8. 生成 CRAFT_SECURITY_KEY 并保存到您的 .env 文件中
  9. 首次安装 Craft，允许您设置管理员的账户凭证
  10. 安装一些 Craft 插件

过程完成后，输入 ddev launch 打开默认浏览器中的项目。🚀

使用 Vite 进行本地开发

要开始使用 Vite 开发服务器和 HMR 进行开发，请运行

make dev

此命令将

  1. 将您的本地 SSH 密钥复制到容器中（如果您正在设置 craft-scripts，这将很有用）
  2. 启动您的 DDEV 项目
  3. 安装 Composer
  4. 安装 npm
  5. 进行一次性的 Vite 构建
  6. 启动 Vite 开发服务器

打开浏览器到项目域名，以验证 Vite 是否连接。开始制作美丽的事物。💖

Makefile

包含了一个 Makefile，以提供常见的开发命令的统一 CLI。

  • make install - 运行一次完整的过程，设置项目并安装 Craft。
  • make up - 启动 DDEV 项目，确保已添加 SSH 密钥，并已安装 npm 和 Composer。
  • make dev - 一次性构建所有前端资产，然后启动 Vite 的服务器进行 HMR。
  • make build - 构建 all front-end assets。
  • make composer xxx - 在容器中运行 Composer 命令，例如 make composer install
  • make craft xxx - 在容器中运行 Craft 命令，例如 make craft project-config/touch
  • make npm xxx - 在容器中运行 npm 命令，例如 make npm install
  • make clean - 删除 composer.lock、package-lock.json 以及整个 node_modules 和 vendor 目录
  • make nuke - 通过运行 make clean（上述）从零开始重新启动项目，然后重新安装 composer 和 node 包
  • make pull - 拉取远程数据库和资产（需要设置 craft-scripts

提示：如果您尝试像 make craft project-config/apply --force 这样的命令，您将看到一个错误，因为 shell 认为 --force 标志应该应用于 make 命令。为了避免这种情况，请使用 --（双横线）来禁用进一步选项处理，如下所示： make -- craft project-config/apply --force

Craft CMS 插件

  1. AWS S3
  2. CKEditor
  3. CP 清除缓存
  4. CP 字段检查
  5. Craft 自动完成
  6. Hyper
  7. 导航
  8. Neo
  9. 快速字段
  10. Ray
  11. Retour
  12. SEOmatic
  13. Vite

JavaScript 库

  1. Alpine
  2. Body 滚动锁定
  3. Splide
  4. GSAP
  5. Quicklink
  6. Reframe
  7. Vanilla Lazyload

Kudos

感谢 Andrew (nystudio107) 和 johndwells 的灵感