README

这是一个针对使用Material-UI的项目的SilverStripe主题模板。

要求

运行composer require olyism/silverstripe-material-ui

进入您的主题文件夹，并使用npm install安装依赖（或使用yarn install进行超快速安装）

然后，在您的browserSync配置中输入您的本地服务器域名，该配置位于gulp/config.js文件中的browserSync.proxy（更改project.vagrant）。

现在您可以运行本地服务器

npm start

gulp默认任务运行gulp watch构建js和css，启动browserSync并监视文件更改gulp build构建js和cssgulp lint运行eslint

所有任务配置应在gulp/config.js中进行。

有关所有任务的详细信息，请参阅gulp/tasks下的文件。

浏览器不允许我们使用Node.js的require方法。使用browserify，我们可以在浏览器中实现依赖管理。它还将代码有效地打包成一个文件，以避免重复使用多次依赖。

在开发和测试网站时，browserSync是一个强大的工具，它将重新构建和刷新网页，让您在工作过程中看到您所做的更改。

Sass是一个CSS预处理器。gulp-sass是sass的node库的gulp包装器。 ideally，所有样式都应在jsx中完成，但如果您需要在src/scss文件夹下添加strong样式，请这样做。

一个有用的存储库，解释了gulp许多功能的工作原理，并包含一个示例项目，帮助您熟悉它。我们使用这个示例构建自己的项目。

将此存储库作为子目录克隆到您的现有主题下（例如 /themes/your-theme/material-ui）。

在mysite下创建一个新页面类型，例如MaterialUIPage，如果您正在扩展Page，则可能希望使用Requirements::clear()清除所有css和js需求。

将根和布局Page.ss模板文件重命名为与您的新页面类型匹配（例如 MaterialUIPage.ss），并将其复制到相应的位置。

更新Head.ss和Tail.ss部分中的css和js链接，以包含子目录（例如 <script src="{$ThemeDir}/material-ui/dist/App.js"></script>）

您可能需要进一步调整MaterialUIPage.ss以匹配您的现有主题。例如，您可能希望省略Head.ss和Tail.ss部分，并使用Requirements。只要在Tail.ss部分中加载了应用的脚本，应用就应该能够运行。

请在GitHub上提出任何问题。