126

Product support

Visit this product's website for support.

Categories

This plugin will render <style><script> tags for your entrypoints.json file, generated by webpack. It will just load the entrypoints.json file and render the tags, it won´t compile it for you.

Webpack Plugin for OctoberCMS

Prepare your theme

  1. Create a themes/[YourTheme]/webpack.config.js (We are using Symfony Webpack Encore)
    Encore
        .setOutputPath('./assets/build/')
        .setPublicPath('/themes/[YourTheme]/assets/build')
  2. Add the build directory
  3. Build your theme
  4. Go on by implementing the tags

Using the plugin

Implement via functions

Use the following minimal skeleton or adapt it

&lt;!DOCTYPE html&gt;
&lt;html&gt;
    &lt;head&gt;
        {{ webpack_styles(&quot;app&quot;, &quot;assets/build/entrypoints.json&quot;) }}
    &lt;/head&gt;

    &lt;body&gt;
        {{ webpack_scripts(&quot;app&quot;, &quot;assets/build/entrypoints.json&quot;) }}
    &lt;/body&gt;
&lt;/html&gt;

Implement via component

Use the following minimal skeleton or adapt it

[webpackStyles]
entrypointsFile = &quot;assets/build/entrypoints.json&quot; // Default
entrypoint = &quot;app&quot; // Default
[webpackScripts]
entrypointsFile = &quot;assets/build/entrypoints.json&quot; // Default
entrypoint = &quot;app&quot; // Default
==
&lt;!DOCTYPE html&gt;
&lt;html&gt;
    &lt;head&gt;
        {% component 'webpackStyles' %}
    &lt;/head&gt;

    &lt;body&gt;
        {% component 'webpackScripts' %}
    &lt;/body&gt;
&lt;/html&gt;

Configuration

You can configure it, by just change the values given in the examples above. These can be left blank, to use the default values

1.1.0

Added documentation and webpack_scripts() + webpack_styles() twig functions

Oct 05, 2020

1.0.0

Initial release

Oct 04, 2020