Merge branch 'release/1.1.0' into v1

CHANGELOG.md

@@ -1,5 +1,13 @@
 # Twigpack Changelog
 
+## 1.1.0 - 2018-10-09
+### Added
+* Strings passed in to `manifestPath` can now be Yii2 aliases as well
+* Added `craft.twigpack.includeFile()`
+* Added `craft.twigpack.includeFileFromManifest()`
+* Added `craft.twigpack.includeInlineCssTags()`
+* Added `craft.twigpack.includeCriticalCssTags()`
+
 ## 1.0.5 - 2018-09-28
 ### Changed
 * Check via `empty()` rather than `!== null` when checking the manifest for module entries

README.md

@@ -34,13 +34,16 @@ Twigpack is a bridge between Twig and webpack, with `manifest.json` & [webpack-d
 
  Twigpack also handles generating the necessary `<script>` and `<link>` tags to support both synchronous and asynchronous loading of JavaScript and CSS.
 
+ Twigpack allows you to include files inline files into your Twig templates that live outside of the `templates/` directory, such as generated Critical CSS files.
+
  Additionally, Twigpack has a caching layer to ensure optimal performance.
 
 ### Why not just use AssetRev?
 
 You might be wondering... why not just use the excellent [AssetRev plugin](https://github.com/clubstudioltd/craft-asset-rev)? You certainly can, and we have in the past. Twigpack was written because:
 * We wanted support for legacy/modern JavaScript bundles
 * We wanted to use `webpack-dev-server` for hot module replacement
+* We wanted a way to inline generated files such as critical css that live outside of the `templates/` directory
 * We wanted a performant caching mechanism in place
 * ...and we also didn't care about various versioning schemes other than the webpack `manifest.json`
 
@@ -73,6 +76,12 @@ return [
             'manifestPath' => 'http://localhost:8080/',
             'publicPath' => 'http://localhost:8080/',
         ],
+        // Local files config
+        'localFiles' => [
+            'basePath' => '@webroot/',
+            'criticalPrefix' => 'dist/criticalcss/',
+            'criticalSuffix' => '_critical.min.css',
+        ],
     ],
     // Live (production) environment
     'live' => [
@@ -93,11 +102,15 @@ return [
   * **legacy** - the name of your legacy manifest file
   * **modern** - the name of your modern manifest file
  * **server** - is an array with `manifestPath` and `publicPath` keys:
-   * **manifestPath** - the public server path to your manifest files; it can be a full URL or a partial path.  This is usually the same as whatever you set your webpack `output.publicPath` to
+   * **manifestPath** - the public server path to your manifest files; it can be a full URL or a partial path, or a Yii2 alias.  This is usually the same as whatever you set your webpack `output.publicPath` to
    * **publicPath** - the public server path to your asset files; it can be a full URL or a partial path. This is usually the same as whatever you set your webpack `output.publicPath` to
  * **devServer** - is an array with `manifestPath` and `publicPath` keys:
-   * **manifestPath** - the devServer path to your manifest files; it can be a full URL or a partial path.  This is usually the same as whatever you set your webpack `devServer.publicPath` to
+   * **manifestPath** - the devServer path to your manifest files; it can be a full URL or a partial path, or a Yii2 alias.  This is usually the same as whatever you set your webpack `devServer.publicPath` to
    * **publicPath** - the devServer path to your asset files; it can be a full URL or a partial path. This is usually the same as whatever you set your webpack `output.publicPath` to
+ * **localFiles** - is an array with `basePath`, `criticalPrefix` and `criticalSuffix` keys:
+   * **basePath** - the file system path or Yii2 alias to the local file system base path of the web root
+   * **criticalPrefix** - the prefix added to the name of the currently rendering template for the critical css file name
+   * **criticalSuffix** - the suffix added to the name of the currently rendering template for the critical css file name
 
 Note that the `manifest.json` is loaded server-side via PHP, so if you're using a VM such as Homestead, the **manifestPath** may be different from the  **publicPath**.
 
@@ -123,6 +136,8 @@ Twigpack will memoize the manifest files for performance, and it will also cache
 
 If `devMode` is off, the files will be cached until Craft Template Caches are cleared (which is typically done via deployment), or Craft's Data Caches are cleared. You can also manually clear the cache by using the **Clear Caches** Utility.
 
+Twigpack also caches any files you include in your Twig documents (see below) using the same data cache, for quick access.
+
 ## Using Twigpack
 
 Here's a simplified example `manifest.json` file that we'll be using for these examples:
@@ -231,6 +246,55 @@ This will output:
 ```html
 /css/style.sfkjsf734ashf.css
 ```
+### Including Files Inline
+
+Twigpack also offers functionality similar to the [Inlin plugin](https://github.com/aelvan/Inlin-Craft), but with a caching layer that uses whatever caching method you have set up (file, Redis, Memcache, etc.).
+
+#### craft.twigpack.includeFile()
+
+`{{ craft.twigpack.includeFile("/path/to/foo.txt") }}`
+
+This will include the file at the file system path specified into the Twig template. Yii2 aliases as supported, e.g.:
+
+`{{ craft.twigpack.includeFile("@webroot/foo.txt") }}`
+
+You can also use a URL:
+
+`{{ craft.twigpack.includeFile("https://example.com/foo.txt") }}`
+
+#### craft.twigpack.includeFileFromManifest()
+
+You can inline a file generated by webpack by referencing the name of the file in the manifest, e.g.:
+
+`{{ craft.twigpack.includeFileFromManifest("webapp.html") }}`
+
+#### craft.twigpack.includeInlineCssTags()
+
+This conveniences function works just like `craft.twigpack.includeFile()` but wraps the included file in `<style></style>` tags, e.g.:
+
+`{{ craft.twigpack.includeInlineCssTags("/path/to/foo.css") }}`
+
+Aliases can also be used:
+
+`{{ craft.twigpack.includeInlineCssTags("@webroot/foo.css") }}`
+
+#### craft.twigpack.includeCriticalCssTags()
+
+If you're using Critical CSS, this function allows you to easily inline the critical CSS by doing just:
+
+`{{ craft.twigpack.includeCriticalCssTags() }}`
+
+It will combine the `localFiles.basePath` with `localFiles.criticalPrefix`, and then add on the path of the currently rendering template, suffixed with `localFiles.criticalSuffix`.
+
+So for example, with the default settings, if the `blog/index` template was rendering, the following file would be included, wrapped in `<style></style>` tags:
+
+`@webroot/` + `dist/criticalcss/` + `blog/index` + `_critical.min.css` or `@webroot/dist/criticalcss/blog/index_critical.min.css`
+
+This works very well with automated systems that can generated Critical CSS, and allows you to have a single `{{ craft.twigpack.includeCriticalCssTags() }}` tag in your `_layout.twig` rather than in every template.
+
+You can override the automatic template name determination by passing in your own path as well:
+
+`{{ craft.twigpack.includeCriticalCssTags("/path/to/foo.css") }}`
 
 ## Just for Fun
 

composer.json

@@ -2,7 +2,7 @@
     "name": "nystudio107/craft-twigpack",
     "description": "Twigpack is a bridge between Twig and webpack, with manifest.json & webpack-dev-server HMR support",
     "type": "craft-plugin",
-    "version": "1.0.5",
+    "version": "1.1.0",
     "keywords": [
         "craftcms",
         "craft-plugin",

src/Twigpack.php

@@ -19,10 +19,12 @@
 use craft\events\DeleteTemplateCachesEvent;
 use craft\events\PluginEvent;
 use craft\events\RegisterCacheOptionsEvent;
+use craft\events\TemplateEvent;
 use craft\services\Plugins;
 use craft\services\TemplateCaches;
 use craft\utilities\ClearCaches;
 use craft\web\twig\variables\CraftVariable;
+use craft\web\View;
 
 use yii\base\Event;
 
@@ -45,6 +47,11 @@ class Twigpack extends Plugin
      */
     public static $plugin;
 
+    /**
+     * @var string
+     */
+    public static $templateName;
+
     // Public Properties
     // =========================================================================
 
@@ -93,6 +100,15 @@ public function clearAllCaches()
      */
     protected function installEventListeners()
     {
+        // Remember the name of the currently rendering template
+        // Handler: View::EVENT_BEFORE_RENDER_PAGE_TEMPLATE
+        Event::on(
+            View::class,
+            View::EVENT_BEFORE_RENDER_PAGE_TEMPLATE,
+            function (TemplateEvent $event) {
+                self::$templateName = $event->template;
+            }
+        );
         // Handler: CraftVariable::EVENT_INIT
         Event::on(
             CraftVariable::class,

src/config.php

@@ -43,6 +43,12 @@
             'manifestPath' => 'http://localhost:8080/',
             'publicPath' => 'http://localhost:8080/',
         ],
+        // Local files config
+        'localFiles' => [
+            'basePath' => '@webroot/',
+            'criticalPrefix' => 'dist/criticalcss/',
+            'criticalSuffix' => '_critical.min.css',
+        ],
     ],
     // Live (production) environment
     'live' => [