view-creative-agency/craft4-starter

基于 Craft4 和 DDEV 的 View Creative Agency 的入门级项目

安装: 45

依赖: 0

建议者: 0

安全: 0

星标: 1

关注者: 1

分支: 0

语言:Twig

类型:项目

1.0.41 2024-02-02 09:52 UTC

README

这是所有使用 Craft4 的 VCA 项目的基础项目。

模板/css/配置等都是从 Craft4 的测试版开始从头重建的。它不是从我们之前的基于 Craft3 的入门级项目升级而来,尽管它重用了一些代码。

对于我们的开发环境,我们正在从 Pixel & Tonic 的 "Nitro"(现已弃用)切换到一个基于 DDEV 的系统,该系统大量借鉴了 onedarnleyroad/craftcms - 但我们有自己的定制(我们不使用 Tailwind、Alpine 等)。

VCA 员工培训

我们过去在 VCA 办公室的自托管服务器上使用 GIT。迁移到 GitHub 应该会带来一些好处

  • 我们不需要管理 GIT 服务器的设置和维护
  • 办公室、办公室网络和办公室硬件不会成为故障点
  • 检出应该更快,因为我们不受办公室上传速度的限制
  • 备份由微软而不是我们处理
  • 对新员工或自由职业者的入职变得容易得多
  • 它将允许我们通过 GIT 而不是 SFTP 将网站上线
  • 如果我们想,我们可以利用像 Issues 这样的功能

您可能想下载 GitHub Desktop 作为 GitHub 项目的图形用户界面,尽管这不是必需的。

分支

您可能不知道 GIT 中的 "分支"。到目前为止,我们一直在 master 分支(现在称为 main 以避免有问题的语言)上工作。从现在起,我们将利用分支来更好地组织事物。

我们的默认分支称为 develop,这意味着该分支中的任何内容都是正在进行的工作。其中的内容预计会发生变化。当我们决定想要将网站上线时,我们将创建一个名为 live 的新分支,并将所有我们的工作复制到该分支中。然后我们将在实时服务器上检出 live 分支。

这意味着我们可以在本地的一个 develop 分支上工作,而不会影响 live 分支中的任何内容。当我们完成添加新功能和进行更改后,我们可以将 develop 分支中的更改 合并live 分支中。然后我们只需要在实时服务器上执行 git pull 来使其反映新的工作。这样,实时服务器始终只使用 live 分支,而我们 始终只在 develop 分支上工作,我们永远不会直接在 live 分支上工作。

我们还可以创建新的分支。例如,如果我们有一个正在运行的网站,该网站正在进行一些新功能的开发,但我们还需要在不部署我们的正在进行中的工作的同时运行实时网站的一些更新... 我们将创建一个从 live 分支 创建 的新临时分支 updates,在该分支上运行更新,提交它们,然后 合并 updateslive... 然后,我们只需在实时服务器上执行 git pull,它就会更新,而不会包含我们的正在进行中的工作。

由于数据库不存储在GIT中,我们有时可能需要(本地)在每个项目中使用多个数据库,以反映实际或开发分支。请记住这一点。

从我们的Craft3构建中的更改

  • 宏现在从一个大文件拆分为多个更有针对性的文件。
    • 例如:{% import '_macros/helpers' as helpers -%}
  • Craft4现在拥有Laravel的"Collections"(集合),我们应该几乎每次都使用它们。这里有关于Collection的更新
    • .all().one()现在通常被.collect()替代

创建新项目

现在使用DDEV,这个存储库本身就是一个Craft CMS起始项目,使用DDEV进行本地托管和Vite进行前端打包和HMR。

  1. composer create-project...
  2. make install
  3. make dev

开发环境

本地机器先决条件

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

入门

选项1:使用Composer(推荐)

如果您在本地机器上安装了Composer - 或者一个指向Docker容器的别名 - 您可以使用create-project来拉取最新的标记版本。

打开终端提示符,并运行

composer create-project view-creative-agency/craft4-starter PATH --no-install

确保PATH是在您自己的机器上的一个现有且为空的文件夹。

选项2:使用Git CLI

或者,您可以通过Git CLI克隆存储库

git clone git@github.com:view-creative-agency/craft4-starter.git PATH

确保PATH是在您自己的机器上的一个现有且为空的文件夹。

接下来,您需要删除现有的/.git目录。在终端中,运行

cd PATH
rm -rf .git

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

cp .env.ddev .env
mv -f composer.json.default composer.json
mv -f .gitignore.default .gitignore
rm CHANGELOG.md && rm LICENSE.md && rm README.md

选项3:手动下载

将存储库的副本下载到您的本地机器,并将其移动到您想运行项目的地方。类似于上面,您接下来想要清理并设置一些默认文件以供使用。在终端中,运行

cd PATH
cp .env.ddev .env
mv -f composer.json.default composer.json
mv -f .gitignore.default .gitignore
rm CHANGELOG.md && rm LICENSE.md && rm README.md

配置DDEV

ddev config

按照提示操作。

  • 项目名称:例如,mysite将生成项目URL为https://mysite.ddev.site(在安装过程中稍后注意这一点)
  • Docroot位置:默认为web,保持不变
  • 项目类型:默认为craftcms,保持不变

安装Craft

获取包含数据的现有示例CMS(推荐)

make seed

这将安装您所需的一切,并将浏览器启动为正在运行的项目。

要安装带有完全空数据库的干净版本的Craft

make install

按照提示操作。

此命令将

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

过程完成后,输入ddev launch命令以在默认浏览器中打开项目。🚀

使用Vite进行本地开发

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

make dev

此命令将

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

打开浏览器到项目域名,以验证Vite已连接。开始创作美好事物。❤️

重要提示:此时项目不在GIT中,它只存在于您的机器上。您必须自己为它创建一个新的仓库 - 请参阅维基。

Makefile

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

  • make install - 运行一次完整的过程来设置项目和安装Craft。
  • make up - 启动DDEV项目,确保已添加SSH密钥,并已安装npm和Composer。
  • make dev - 运行所有前端资源的构建,然后启动Vite服务器进行HMR。
  • make build - 构建所有前端资源。
  • make composer xxx - 在容器中运行Composer命令,例如make composer install
  • make craft xxx - 在容器中运行Craft命令,例如make craft project-config/touch
  • make npm xxx - 在容器中运行npm命令,例如make npm install
  • make pull - 拉取远程数据库和资源(需要设置craft-scripts

添加PostCSS插件

需要像这样操作:ddev exec npm install --save-dev postcss-nesting之后,您可以编辑postcss.config.js文件以实际使用它。

致谢与鸣谢