If a question has a default value, just hit enter to accept the default.

After answering each question, the script will then process the necessary
files by replacing named tokens in each file with the corresponding setup value.

By default, these files are:

_config.php

_config/config.yml

admin/client/src/bundles/bundle.js

admin/client/src/styles/_variables.scss

admin/client/src/styles/bundle.scss

client/src/bundles/bundle.js

client/src/styles/_variables.scss

client/src/styles/bundle.scss

composer.json

package.json

webpack.config.js

Each file needs to readable and writable. The setup script will first
verify that it can process each file before proceeding.

Configuration

The setup script supports a setup.json file kept in the same location
as setup.php. Using this file, you can override any of the default
configuration settings. By forking the repo and adding your own settings
to this file, you can save yourself even more typing. For example:

Usage

The module comes pre-configured with everything you need to get underway. Frontend resources
are processed and bundled using webpack, and the included config is ready to create bundles for
both the website and the CMS. Your admin bundles will be included in the CMS automatically
(see config.yml), however you will need to handle loading the website bundles yourself,
e.g. by using Requirements in your controller.

A yarn.lock file is included with the repo. To install build dependencies, run:

$ yarn install

This will download all of the build dependencies into the node_modules folder. Two scripts are pre-configured
for Yarn, watch for development, and build for production:

$ yarn watch

This will watch your source files and automatically recompile when a change is detected.

$ yarn build

This will prepare your files for distribution by clearing the dist/ folders and compiling + optimising the
created bundles.

Bundles

Using the default webpack config, bundle files will be created from your source files in two locations:

admin/client/dist/

client/dist/

These folders are exposed by default within the composer.json file, so that when your module is installed into
a SilverStripe v4 app, these folders are automatically exposed in the resources/ folder.

To include your module bundles for the website, you'll need to load your dist/ bundles, for example
by using the SilverStripe Requirements class in your controller (where vendor/module is your repository name):

Source

The webpack build relies on two pairs of source bundle files for the CMS and website:

admin/client/src/bundles/bundle.js

admin/client/src/styles/bundle.scss

client/src/bundles/bundle.js

client/src/styles/bundle.scss

Each bundle.js file will pull in any required JavaScript and Sass styles. By default, each bundle.js
requires the bundle.scss file to load your styles. Each bundle.scss file imports variables from the_variables.scss file by default.

The general idea is to add your own JavaScript under each src/ folder for anything you need, and to add your styles
as .scss files under the src/styles/ folder. Then edit each bundle to require or import your source files. For
example:

Icons

Copy any icon files required for your SilverStripe page classes into the admin/client/src/images/icons/ folder.
These images will be copied to the admin/client/dist/ folder upon watch or build. You can reference these icons
in your classes by using the following notation (where vendor/module is your repository name):