twohill/silverstripe-standard-base

带有开发工具的基本 SilverStripe 安装配方。使用 Webpack 进行前端和 Docker 进行托管

维护者

详细信息

github.com/twohill/silverstripe-standard-base

源代码

问题

安装: 37

依赖: 0

建议者: 0

安全性: 0

星星: 3

观察者: 3

分支: 1

开放问题: 0

语言：JavaScript

类型：silverstripe-recipe

v0.5 2019-02-25 08:25 UTC

Requires

Requires (Dev)

BSD-3-Clause 776c8f38d8b801ad540260b07f576b4c802daebe

  • Al Twohill <al.woop@twohill.nz>

This package is auto-updated.

Last update: 2024-08-27 16:12:10 UTC

README

这是 Twohill & Co 为快速在 SilverStripe 4 中启动而使用的标准基础配方。

先决条件

  • Composer
  • Yarn
  • Docker

入门指南

  1. 创建 composer 项目并构建前端

    composer create-project twohill/silverstripe-standard-base
yarn build

  2. 将 example.env 复制/重命名为 .env 并根据需要更新详细信息。

    copy example.env .env

    您需要更新 WEBPACK_IP 和 WEBPACK_PORT 以适应您的环境，以便热重载功能能正确工作。

    请确保您更改此文件中的 SQL 根密码！

  3. 启动 docker 容器

    docker-compose up

  4. 打开新的终端并启动 webpack

    yarn watch

构建生产版本

yarn build

此过程将构建和压缩您的 scss，打包您的 js，并将您在 app/client/src/ 中拥有的任何图像文件复制到 app/client/dist/，并将其部署到 app/client/dist/。您的模板在发布时应使用 dist 目录。

已知问题

  • 每次您添加或更改图像时，都需要运行 yarn build，因为 Webpack 热加载器不会检测到这一点。
  • 构建过程还会为 css 包生成 .js 文件。您可以忽略这些文件。
  • src 和 dist 之间实际上存在图像文件的双重。欢迎提出改进的方案。

如何使用此配方

JavaScript

app/client/src/js/main.js 是 JavaScript 应用的起点。您可以使用 ES6，并且它将由 babel 为您转换。jQuery 与 Bootstrap 4 一起打包。

使用 yarn add --dev PACKAGE_NAME 添加额外的 JavaScript 框架。

如果您正在通过 yarn watch 运行 webpack，那么在您做出更改时，您的页面应自动刷新。

样式表

创建了两个样式表包：用于 HTMLTextEditor 的 editor.scss 和用于其他所有内容的 bundle.scss。 bundle.scss 包含 editor.scss，因此您无需重复样式。您可以拆分样式到多个文件中以提高可维护性，webpack 会为您压缩它们。

布局和默认样式由 Bootstrap 4 管理。