PHPackages                             la-haute-societe/craft-webpack-assets - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. la-haute-societe/craft-webpack-assets

ActiveCraft-plugin[Utility & Helpers](/categories/utility)

la-haute-societe/craft-webpack-assets
=====================================

Webpack assets for Craft CMS

2.0.4(7y ago)63.7k[1 issues](https://github.com/la-haute-societe/craft-webpack-assets/issues)[1 PRs](https://github.com/la-haute-societe/craft-webpack-assets/pulls)MITPHP

Since Mar 7Pushed 7y ago4 watchersCompare

[ Source](https://github.com/la-haute-societe/craft-webpack-assets)[ Packagist](https://packagist.org/packages/la-haute-societe/craft-webpack-assets)[ RSS](/packages/la-haute-societe-craft-webpack-assets/feed)WikiDiscussions master Synced 1mo ago

READMEChangelog (4)Dependencies (1)Versions (7)Used By (0)

Webpack assets - Craft plugin
=============================

[](#webpack-assets---craft-plugin)

A simple plugin allowing to handle [Webpack](https://webpack.js.org) generated CSS and Javascript assets within [Craft CMS](http://craftcms.com/) templates.

Requirements
------------

[](#requirements)

This plugin requires **Craft CMS 3.0.0-RC1** or later. It is intended to work with **Webpack 2 or 3**.

### Installation

[](#installation)

- Install with composer from your project directory:

```
composer require la-haute-societe/craft-webpack-assets

```

### Webpack setup

[](#webpack-setup)

- To generate the intended JSON files, add the following NPM packages:

```
yarn add html-webpack-plugin write-file-webpack-plugin underscore-template-loader -D
# Or
npm install html-webpack-plugin write-file-webpack-plugin underscore-template-loader --save-dev

```

- Somewhere in your assets source folder, create a `assets-files.json.tpl` file with the following content :

```

```

- In the Webpack config add the following plugins :

```
{
    plugins: [
        new HtmlWebpackPlugin({
            filename: 'generated-assets-files.json',
            template: 'underscore-template-loader!path/to/templates/assets-files.json.tpl',
            inject: false,
            chunksSortMode: 'dependency'
        }),
        new WriteFilePlugin({
            test:  /generated-assets-files\.json$/,
            force: true,
            log: false
        })
    ]
}
```

> Adjust the `template` value to the path of the previously created `assets-files.json.tpl` file.

- Finally, run your Webpack process, as usual.

Configuration
-------------

[](#configuration)

In the `config` folder at the root of your Craft project, create a `webpackassets.php` file with the following content and adjust the path to the JSON generated by Webpack.

```