Silverstripe - 包括样式表和脚本答案

【问题标题】：Silverstripe - Include Stylesheets and ScriptsSilverstripe - 包括样式表和脚本
【发布时间】：2021-07-16 18:45:27
【问题描述】：

我已经设置了 Silverstripe 的全新安装并创建了一个新主题。现在我想在 Page.ss 中包含一个 CSS，但是我收到一条错误消息，指出找不到该文件。我想将主题文件夹中的文件包含在“my-site/themes/my-theme/css/style.css”下。但是，使用“themedCSS('style')”的集成仅在文件已在“my-site/public/_resources/themes/my-theme/css/style.css”下再次集成时才有效。我已经尝试过所有变体，但只有当 CSS 文件同时存在于两个地方时才有效。

由于我无法想象这是最佳做法，我想知道我缺少什么。此外，如果同时包含“/themes/my-theme/css/style.css”下的样式，则完全忽略它们。

【问题讨论】：

标签： themes silverstripe

【解决方案1】：

在 SilverStripe 版本 4 中，您希望浏览器能够请求的所有资源文件必须在 public 文件夹中可用。您无需手动将文件从应用主题文件夹复制到公用文件夹，而是定义要在 composer.json 文件中公开的文件。

// composer.json
...
"extra": {
        ...
        "expose": [
            "themes/my-theme/css",
            "themes/my-theme/js",
            // Any other files or folders you want to expose
        ]
    },

然后，当您在终端中运行composer vendor-expose 命令时，它会将列出的文件公开到公用文件夹。

默认情况下，expose 命令将在公共文件夹和项目文件夹之间创建一个符号链接，因此您的所有更改也将反映在那里，这样您就不需要在每次更改后运行 Expose 命令，只有当您添加要公开的新文件。

也可以通过页面控制器导入资源文件，如下：

// A page controller, e.g. "PageController.php"

    protected function init()
    {
        parent::init();
        self::myImports();
    }

    private static function myImports() {
        // Files must be available in the public folder:
        // - "/public/_resources/themes/my-theme/css/app.css"
        // - "/public/_resources/themes/my-theme/js/app.js"
        Requirements::css('./themes/my-theme/css/app.css');
        Requirements::javascript('./themes/my-theme/js/app.js');
    }

【讨论】：

非常感谢您的解释！