From f84dabcc5bee2a9f7cf36f57a7cbed678bd4dc3d Mon Sep 17 00:00:00 2001 From: Jon Uhlmann Date: Tue, 23 Aug 2022 16:26:03 +0200 Subject: [PATCH] Breaking: Remove Google Fonts integration --- Configuration/Settings.Carbon.yaml | 1 - README.md | 30 +++++++------------ .../Fusion/External/GoogleFonts.fusion | 23 -------------- .../Private/Fusion/Internal/Assets.fusion | 1 - 4 files changed, 11 insertions(+), 44 deletions(-) delete mode 100644 Resources/Private/Fusion/External/GoogleFonts.fusion diff --git a/Configuration/Settings.Carbon.yaml b/Configuration/Settings.Carbon.yaml index b445532..0e8eb13 100644 --- a/Configuration/Settings.Carbon.yaml +++ b/Configuration/Settings.Carbon.yaml @@ -9,7 +9,6 @@ Carbon: IncludeAssets: LoadJSforCSSAsynchron: true - GoogleFonts: null # e.g. 'Lato|Open+Sans:400,700', for async loading e.g. 'Lato|Open+Sans:400,700[async]' ResourceHints: DnsPrefetch: [] # Add Preconnect: [] # Add diff --git a/README.md b/README.md index 99cd5e9..cbbdb9b 100755 --- a/README.md +++ b/README.md @@ -6,7 +6,7 @@ With this package, you get able to import all your CSS and Javascript assets wit - You can define multiple files from multiple packages. - You can pass the filenames as a string (comma separated) or as an array (recommended) -- If you want to add attributes, add it with square brackets e.g. +- If you want to add attributes, add it with square brackets e.g. `Filename.js[async data-prop data-attr="true" class="-js-loader"]` - If you want to get a file included inline, add the attribute `inline`: e.g. `Filename.css[inline]` - You can add multiple resources per line. E. g. `Slider.js,Main.css,Footer.css[async class="footer-styles"],Header[inline class="header-styles"],//ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js[async]` @@ -23,7 +23,6 @@ In [`Carbon.IncludeAssets`](Configuration/Settings.yaml#L19) following settings | Key |  Description | | ----------------------- | -------------------------------------------------------------------------------------------------------------------------- | | `LoadJSforCSSAsynchron` | (boolean) If true the javascript for asynchronous CSS get inlined (If needed). Defaults to `true` | -| `GoogleFonts` | (string) If set, these fonts will included from Google. E.g. `Lato\|Open+Sans:400,700` Defaults to `null` | | `ResourceHints` | (array) The setting, which global [resource hints] should be added. | | `Default` | (array) The default setting for a `Packages` entry. If a key is not set within a `Packages` entry, this value will be used | @@ -31,16 +30,16 @@ In [`Carbon.IncludeAssets`](Configuration/Settings.yaml#L19) following settings In `Carbon.IncludeAssets.Packages` you can define your packages, which should output assets. The keys get sorted first by numbers, then by characters. Like that, it is possible to define a load order for you packages. A single entry can have following entries (The Defaults are stored in [`Carbon.IncludeAssets.Default`](Configuration/Settings.yaml#L30)): -| Key |  Description | -| -------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| `Package` | (string) The package key. If it set to `SitePackage`, it will be replaced automatically with the package key from the site package. Defaults to `SitePackage` | -| `CacheBuster` | (boolean) Append a hash value from the content of the file. Defaults to `true` | -| `ConditionPrototype` | (string) If set, the files get only included if the fusion prototype returns a truthy value. Defaults to `null` | -| `Wrapper` | (string) If set, the generated tags will be wrapped. `{content}` will be replaced with the tags. Example: `''` | +| Key |  Description | +| -------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| `Package` | (string) The package key. If it set to `SitePackage`, it will be replaced automatically with the package key from the site package. Defaults to `SitePackage` | +| `CacheBuster` | (boolean) Append a hash value from the content of the file. Defaults to `true` | +| `ConditionPrototype` | (string) If set, the files get only included if the fusion prototype returns a truthy value. Defaults to `null` | +| `Wrapper` | (string) If set, the generated tags will be wrapped. `{content}` will be replaced with the tags. Example: `''` | | `Path` | (array) Define the files get loaded from. There are different paths for inline and linked files. Every type (`css`,`js`, `mjs`, `html`, `preloadasset`, `preloadcss`, `preloadscript` or `modulepreload`) can have a different path inside the Resources folder | -| `General` | (array) Asset files who get loaded in live and backend view. Contains four entries: `Head`, `Body`, `HeadStart` and `BodyStart` | -| `Backend` | (array) Asset files that get loaded only in the backend view. Contains four entries: `Head`, `Body`, `HeadStart` and `BodyStart` | -| `Live` | (array) Asset files that get loaded only in the live view. Contains four entries: `Head`, `Body`, `HeadStart` and `BodyStart` | +| `General` | (array) Asset files who get loaded in live and backend view. Contains four entries: `Head`, `Body`, `HeadStart` and `BodyStart` | +| `Backend` | (array) Asset files that get loaded only in the backend view. Contains four entries: `Head`, `Body`, `HeadStart` and `BodyStart` | +| `Live` | (array) Asset files that get loaded only in the live view. Contains four entries: `Head`, `Body`, `HeadStart` and `BodyStart` | ## Example @@ -50,7 +49,6 @@ Here is a small example: Carbon: IncludeAssets: LoadJSforCSSAsynchron: true - GoogleFonts: "Lato|Open+Sans:400,700&display=swap[async]" ResourceHints: # Preconnect to these domains Preconnect: @@ -190,10 +188,6 @@ The heart of this package. This prototype generates a `script`, `style`, and `li | `assetPath` | (string) The path to the file inside the Resources folder. Per default, it is set dynamically | | `wrapper` | (string) If set, the tag will be wrapped. `{content}` will be replaced with the tag. Example: `''` | -### [Carbon.IncludeAssets:GoogleFonts] - -You can set the property `fonts` e.g. `Lato|Open+Sans:400,700` and the `style` tag get generated. Per default, this prototype read the [`Settings.yaml`](Configuration/Settings.yaml#L21). - ### [Carbon.IncludeAssets:ResourceHints] This prototype renders the [resource hints] for the browser. Per default, this prototype read the [`Settings.yaml`](Configuration/Settings.yaml#L22-L28). But you can also pass `preloadNodes` or `prerenderNodes` (Array, FlowQuery, or a single node) for further optimization. @@ -203,10 +197,9 @@ This prototype renders the [resource hints] for the browser. Per default, this p If you have [Sandstorm.CookiePunch] installed, please add the following attribute to your script entry: ```yaml - - YourJSFile.js[data-never-block] +- YourJSFile.js[data-never-block] ``` - ## Installation Most of the time, you have to make small adjustments to a package (e.g., the configuration in [`Settings.yaml`]). Because of that, it is important to add the corresponding package to the composer from your theme package. Mostly this is the site package located under `Packages/Sites/`. To install it correctly go to your theme package (e.g.`Packages/Sites/Foo.Bar`) and run following command: @@ -231,7 +224,6 @@ The `--no-update` command prevent the automatic update of the dependencies. Afte [carbon.includeassets:case]: Resources/Private/Fusion/External/Case.fusion [carbon.includeassets:collection]: Resources/Private/Fusion/External/Collection.fusion [carbon.includeassets:file]: Resources/Private/Fusion/External/File.fusion -[carbon.includeassets:googlefonts]: Resources/Private/Fusion/External/GoogleFonts.fusion [carbon.includeassets:resourcehints]: Resources/Private/Fusion/External/ResourceHints.fusion [resource hints]: https://www.smashingmagazine.com/2019/04/optimization-performance-resource-hints/ [sandstorm.cookiepunch]: https://github.com/sandstorm/Sandstorm.CookiePunch diff --git a/Resources/Private/Fusion/External/GoogleFonts.fusion b/Resources/Private/Fusion/External/GoogleFonts.fusion deleted file mode 100644 index 4d43089..0000000 --- a/Resources/Private/Fusion/External/GoogleFonts.fusion +++ /dev/null @@ -1,23 +0,0 @@ -/** - * This prototype outputs the style tag for include a font from google - * - * Examples: - * fonts = 'Lato' - * fonts = 'Open+Sans:400,700' - * fonts = 'Lato|Open+Sans:400,700' - * fonts = 'Lato|Open+Sans:400,700[async]' - */ - -prototype(Carbon.IncludeAssets:GoogleFonts) < prototype(Neos.Fusion:Component) { - @propTypes { - fonts = ${PropTypes.string} - } - - fonts = ${Configuration.setting('Carbon.IncludeAssets.GoogleFonts')} - - @if.hasFonts = ${!String.isBlank(this.fonts)} - - renderer = afx` - - ` -} diff --git a/Resources/Private/Fusion/Internal/Assets.fusion b/Resources/Private/Fusion/Internal/Assets.fusion index 7eb5b82..2e4217a 100644 --- a/Resources/Private/Fusion/Internal/Assets.fusion +++ b/Resources/Private/Fusion/Internal/Assets.fusion @@ -23,7 +23,6 @@ prototype(Carbon.IncludeAssets:Internal.Assets) < prototype(Neos.Fusion:Componen renderer = afx` - {props.filesFromPackages} `