https://github.com/hurnell/cakephp-webpack-encore-view-helper

CakePhp view helper plugin to load webpack-encore assets. Reads entrypoints.json and manifest.json and loads the assets referenced herein when requested.
https://github.com/hurnell/cakephp-webpack-encore-view-helper

cakephp cakephp-plugin cakephp3 encore php71 webpack4

Last synced: about 1 month ago
JSON representation

CakePhp view helper plugin to load webpack-encore assets. Reads entrypoints.json and manifest.json and loads the assets referenced herein when requested.

• Host: GitHub
• URL: https://github.com/hurnell/cakephp-webpack-encore-view-helper
• Owner: hurnell
• License: mit
• Created: 2019-04-11T07:27:42.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2019-04-11T09:21:33.000Z (over 5 years ago)
• Last Synced: 2024-10-13T12:22:16.175Z (2 months ago)
• Topics: cakephp, cakephp-plugin, cakephp3, encore, php71, webpack4
• Language: PHP
• Homepage:
• Size: 6.84 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# WebpackEncoreViewHelper plugin for CakePHP

## Installation

You can install this plugin into your CakePHP application using [composer](http://getcomposer.org).

The recommended way to install composer packages is:

```

composer require hurnell/cakephp-webpack-encore-view-helper

```

Make sure that composer.json of your CakePHP installation contains:

```

"minimum-stability": "dev",

"prefer-stable": true

```

## Initialize

In App/View/AppView add use statement and update initialize method:

```

use Hurnell\WebpackEncoreViewHelper\View\Helper\EncoreHelper

$this->loadHelper('Encore', [

    'className'=> EncoreHelper::class

]);

```

## Usage

In your .ctp files just add:

```

    = $this->Encore->load('build/js/entry.js') ?>

    = $this->Encore->load('build/js/entry.css') ?>

    = $this->Encore->load('build/css/main.css') ?>

```

These entrypoints are defined in your webpack.config.js file (see dist directory).

I have also included my package.json file in the dist directory to shows the packages I have installed to support this version of webpack.config.js. 

Note that the only way that I was able to get hot module replacement (auto reload web-page when you update asset files) to work was with:

```

yarn encore dev-server --port 8080 --disableHostCheck=true

```

There is a shortcut defined under scripts in package.json:

```

yarn dev-server

```

Check out [webpack-visualizer](https://chrisbateman.github.io/webpack-visualizer/) to help optimise your imports. Just run ```yarn stats ``` and upload the resulting stats.json file to this website.