suilven/silverstripe-terms-and-conditions

将条款和条件字段添加到 SilverStripe 表单中。

安装: 22

依赖: 0

建议者: 0

安全: 0

星星: 0

关注者: 1

分支: 0

开放问题: 0

语言:JavaScript

类型:silverstripe-vendormodule

0.0.6 2018-06-08 10:03 UTC

This package is auto-updated.

Last update: 2024-09-27 07:45:12 UTC


README

一个入门套件,包含您开始使用 SilverStripe v4 的新模块所需的一切。

内容

要求

  • Git
  • PHP
  • Node.js
  • Yarn(或npm)

安装

使用 git,将仓库克隆到您选择的目录

$ git clone https://github.com/praxisnetau/silverstripe-module-starter ./my-repo-name

在仓库克隆完成后,您需要运行 setup.php 脚本

$ cd my-repo-name
$ php ./setup.php

设置脚本将提出一系列问题,以收集有关您新模块的数据

$ php ./setup.php
================================================================================
SILVERSTRIPE MODULE SETUP
================================================================================
> Loading config file...
> Checking files...
> Files OK!
> Gathering setup data...
Vendor (default "vendor"): examplecorp
Module (default "module"): awesome-module
Repository name (default "examplecorp/awesome-module"):
Repository URL (default "https://github.com/examplecorp/awesome-module"):
Module name (default "My SilverStripe Module"): My Awesome Module
Namespace (PSR-4) (default "Vendor\Module"): Example\Awesome
Description: An awesome new SilverStripe module.
Author (default "My Name"): Jane Bloggs
Email (default "name@example.com"): jane@example.com
Organisation (default "My Organisation"): Example Corp
Homepage (default "https://www.example.com"):
Keywords (comma-separated): silverstripe, example

如果问题有默认值,只需按回车键即可接受默认值。

回答每个问题后,脚本将处理必要的文件,通过在每个文件中替换命名的令牌来替换相应的设置值。

默认情况下,这些文件是

  • _config.php
  • _config/config.yml
  • admin/client/src/bundles/bundle.js
  • admin/client/src/styles/_variables.scss
  • admin/client/src/styles/bundle.scss
  • client/src/bundles/bundle.js
  • client/src/styles/_variables.scss
  • client/src/styles/bundle.scss
  • composer.json
  • package.json
  • webpack.config.js

每个文件都需要可读和可写。设置脚本将在继续之前首先验证它是否可以处理每个文件。

配置

设置脚本支持与 setup.php 位于同一位置的 setup.json 文件。使用此文件,您可以覆盖任何默认配置设置。通过将仓库分支并添加您自己的设置到此文件,您可以节省更多时间。例如

{
  "default-vendor": "examplecorp",
  "default-author": "Jane Bloggs",
  "default-email": "jane@example.com",
  "default-organisation": "Example Corp",
  "default-homepage": "https://www.example.com"
}

使用

模块已经预先配置好了所有您开始所需的一切。前端资源通过 webpack 处理和捆绑,包含的配置已准备好为网站和 CMS 创建捆绑包。您的管理捆绑包将自动包含在 CMS 中(请参阅 config.yml),但是您需要自己处理加载网站捆绑包,例如通过在控制器中使用 SilverStripe 的 Requirements 类(其中 vendor/module 是您的存储库名称)。

仓库中包含一个 yarn.lock 文件。要安装构建依赖项,运行

$ yarn install

这将下载所有构建依赖项到 node_modules 文件夹。为 Yarn 预配置了两个脚本,watch 用于开发,build 用于生产

$ yarn watch

这将监视您的源文件,并在检测到更改时自动重新编译。

$ yarn build

这将准备您的文件以进行分发,通过清除 dist/ 文件夹并编译 + 优化创建的捆绑包。

捆绑包

使用默认的 webpack 配置,捆绑文件将从您的源文件在两个位置创建

  • admin/client/dist/
  • client/dist/

这些文件夹默认由 composer.json 文件公开,因此当您的模块安装到 SilverStripe v4 应用程序中时,这些文件夹将自动在 resources/ 文件夹中公开。

要包含您的模块捆绑包以供网站使用,您需要加载您的 dist/ 捆绑包,例如通过在控制器中使用 SilverStripe 的 Requirements 类(其中 vendor/module 是您的存储库名称)。

use SilverStripe\View\Requirements;

Requirements::css('vendor/module: client/dist/styles/bundle.css');
Requirements::javascript('vendor/module: client/dist/js/bundle.js');

源代码

Webpack构建依赖于CMS和网站的两组源包文件。

  • admin/client/src/bundles/bundle.js
  • admin/client/src/styles/bundle.scss
  • client/src/bundles/bundle.js
  • client/src/styles/bundle.scss

每个bundle.js文件会引入所需的JavaScript和Sass样式。默认情况下,每个bundle.js都需要加载bundle.scss文件来加载样式。每个bundle.scss文件默认会从_variables.scss文件导入变量。

总体思路是在每个src/文件夹下添加需要的自定义JavaScript,并在src/styles/文件夹下添加样式为.scss的文件。然后编辑每个包以要求或导入源文件。例如:

示例脚本包

/* Module Bundle
===================================================================================================================== */

// Load Styles:

require('styles/bundle.scss');

// Load Scripts:

require('pages/MyPage.js');

这将需要src/pages/MyPage.js文件。

示例样式包

/* Module Bundle
===================================================================================================================== */

// Import Variables:

@import "variables";

// Import Styles:

@import "pages/MyPage";

这将导入src/styles/pages/MyPage.scss文件。

图标

将需要的图标文件复制到admin/client/src/images/icons/文件夹中,用于SilverStripe页面类。在执行watchbuild时,这些图像将被复制到admin/client/dist/文件夹中。您可以通过以下标记在类中引用这些图标(其中vendor/module是您的仓库名称)

class MyPage extends Page
{
    private static $icon = 'vendor/module: admin/client/dist/images/icons/MyPage.png';
}

问题

请使用GitHub问题跟踪器来提交错误报告和功能请求。

贡献

我们热烈欢迎您的贡献,以帮助使本项目更好。有关更多信息,请参阅贡献指南

维护者

许可

BSD-3-Clause © Praxis Interactive