PHPackages                             batch/craft-starter - 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. batch/craft-starter

Abandoned → [batch/craft](/?search=batch%2Fcraft)Project

batch/craft-starter
===================

Batch's Composer starter project for Craft CMS

v2.0.0(5y ago)1247[14 issues](https://github.com/batchnz/craft/issues)[2 PRs](https://github.com/batchnz/craft/pulls)UnlicenseJavaScriptCI failing

Since Mar 20Pushed 5y ago3 watchersCompare

[ Source](https://github.com/batchnz/craft)[ Packagist](https://packagist.org/packages/batch/craft-starter)[ Docs](https://craftcms.com/)[ RSS](/packages/batch-craft-starter/feed)WikiDiscussions master Synced yesterday

READMEChangelog (4)Dependencies (3)Versions (12)Used By (0)

[![Contributors](https://camo.githubusercontent.com/da00de6632e31c0b9d950e2436164f4489f4d41837a547ee6da04716fdeb6865/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f636f6e7472696275746f72732f62617463686e7a2f63726166742e7376673f7374796c653d666c61742d737175617265)](https://github.com/batchnz/craft/graphs/contributors)[![Forks](https://camo.githubusercontent.com/80d77d68c09fcf999a382da80aeb2cbc3d994b363de83f48f4fd8a3a4554bcd8/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f666f726b732f62617463686e7a2f63726166742e7376673f7374796c653d666c61742d737175617265)](https://github.com/batchnz/craft/network/members)[![Stargazers](https://camo.githubusercontent.com/fed6934165ec237f66b86a89178adf1e83b89c1b7e5c3d3df825799e39763763/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f73746172732f62617463686e7a2f63726166742e7376673f7374796c653d666c61742d737175617265)](https://github.com/batchnz/craft/stargazers)[![Issues](https://camo.githubusercontent.com/c58ce2b87e5656929791042d6928bfe115085f191d97343fe69faaba6fa83e2e/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f6973737565732f62617463686e7a2f63726166742e7376673f7374796c653d666c61742d737175617265)](https://github.com/batchnz/craft/issues)[![MIT License](https://camo.githubusercontent.com/c6bf7e68390159fef28e8c4189697e5ab3959c22a298a128f552c70ba213923c/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f6c6963656e73652f62617463686e7a2f63726166742e7376673f7374796c653d666c61742d737175617265)](https://github.com/batchnz/craft/blob/master/LICENSE)

 [ ![Batch logo](https://camo.githubusercontent.com/373be796ec7a5f4fde0752fa59c5f2d86c5fe93489bb1413523d246ceaf278b7/68747470733a2f2f7777772e62617463682e6e7a2f62617463682d6c6f676f2e706e67) ](https://github.com/batchnz/craft)

### Batch Craft Starter

[](#batch-craft-starter)

 An opinionated Craft CMS project starter that integrates Vue.js, Tailwind CSS and Docksal configuration.
 [**Explore the docs »**](https://github.com/batchnz/craft)

 [Report Bug](https://github.com/batchnz/craft/issues) · [Request Feature](https://github.com/batchnz/craft/issues)

Table of Contents
-----------------

[](#table-of-contents)

- [About the Project](#about-the-project)
    - [Built With](#built-with)
- [Getting Started](#getting-started)
    - [Prerequisites](#prerequisites)
    - [Installation](#installation)
- [Usage](#usage)
    - [Webpack Build Tool](#webpack--build-tool)
    - [Build Configuration](#build-configuration)
    - [Craft Plugins](#craft-plugins)
    - [Mixing Inline Scripts with Vue](#mixing-inline-scripts-with-vue)
- [Roadmap](#roadmap)
- [Contributing](#contributing)
- [License](#license)
- [Contact](#contact)
- [Acknowledgements](#acknowledgements)

About The Project
-----------------

[](#about-the-project)

The idea behind this project was to create a Craft CMS starter that allows us to get up and running and developing on projects quickly.

This starter comes set up, ready for for development with:

- Tailwind CSS
- Vue.js
- [craft-webpack](https://github.com/batchnz/craft-webpack) - our Webpack build configuration
- Craft CMS with Twigpack
- Jest for frontend testing
- Docksal configuration

### Built With

[](#built-with)

- [Craft CMS](https://craftcms.com/)
- [Vue.js](https://vuejs.org/)
- [Tailwind CSS](https://tailwindcss.com/)
- [Webpack](https://webpack.js.org/)
- [Jest](https://jestjs.io/)
- [Docksal](https://docksal.io/)

Getting Started
---------------

[](#getting-started)

To create a new project using this starter, follow the below steps.

### Prerequisites

[](#prerequisites)

In order to use the this starter, you'll need to have Docksal up and running. You can find instructions at .

### Installation

[](#installation)

#### Create a new project via composer

[](#create-a-new-project-via-composer)

```
fin rc composer create-project batch/craft myproject --remove-vcs
```

Replace 'myproject' with the desired project directory name.

**Note:** We recommend using Docksal's [fin rc](https://docs.docksal.io/fin/fin-help/#run-cli) and [fin exec](https://docs.docksal.io/fin/fin-help/#exec) commands, which will execute the commands on a standalone 'cli' container mapped to the current directory. This ensures the commands will run even if Composer or NPM are not installed locally.

The `--remove-vcs` flag will removes the batch/craft git metadata so this will be ready for use in a project repository.

#### Run the installer

[](#run-the-installer)

We include an installer script that will finish setting up your project:

`fin batch/install`

After executing this and following the prompts your project should be available at the configured domain, and you should see a demo page to confirm.

This command sets up SSL certificates using mkcert, runs the Craft installer, installs the Twigpack plugin and npm dependencies and performs an initial build of the frontend assets. If you wish to do these steps manually, see the instructions below.

### Manual installation

[](#manual-installation)

1. Generate an SSL certificate. We recommend using the [mkcert global addon](https://docs.docksal.io/tools/mkcert#setup-and-usage-via-addon) which can be installed with: `fin addon install --global mkcert`

```
fin mkcert create
```

2. Start up the Docksal container

```
fin up
```

3. Install Craft via the CLI

```
fin exec craft install
```

4. Install the Twigpack plugin

```
fin exec craft plugin/install twigpack
```

5. Install npm dependencies

```
fin exec npm install
```

6. Build the asset files

```
fin exec npm run build
```

That's it! Your new project should now be available at the configured domain and you should see a demo page to confirm.

Usage
-----

[](#usage)

### Webpack / Build Tool

[](#webpack--build-tool)

Install the depdendencies for the build tool

```
fin exec npm install
```

**Production**

```
fin exec npm run build
```

**Development**

Run the development pipeline on the Docksal container. It will be available at webpack.{yourdomain}

```
fin exec npm run dev
```

Use the following commands to specifically generate a *legacy* or *combined* browser build during development

```
fin exec npm run dev-legacy
fin exec npm run dev-combined
```

### Build Configuration

[](#build-configuration)

**Settings**

The build settings in [webpack.settings.js](https://github.com/batchnz/craft-webpack/blob/master/webpack.settings.js) can be overridden at a project level by placing a webpack.settings.js file in the project root. This will be merged with the base webpack.settings.js file during build.

Example:

```
module.exports = {
    paths: {
        src: {
            base: "./resources/",
            css: "./resources/css/",
            js: "./resources/js/"
        }
    }
};
```

**Webpack Config**

Any custom Webpack config can be included by adding a webpack.config.js in the project root. This will be merged with the final Webpack config during build.

Example:

```
const path = require("path");

module.exports = {
  resolve: {
    alias: {
      "#": path.resolve(__dirname, "src/vue/")
    }
  }
};
```

We have provided a set of defaults to alias the src/ paths and additional entry points.

### Craft Plugins

[](#craft-plugins)

Use the `fin exec craft plugin/install` command to install any additional plugins.

Twigpack is required, and installed by default. We also include the following common plugins in the composer.json dependencies:

- [Mailgun](https://github.com/craftcms/mailgun) - `fin exec craft plugin/install mailgun`
- [Redactor](https://github.com/craftcms/redactor) - `fin exec craft plugin/install redactor`
- [SEOMatic](https://github.com/nystudio107/craft-seomatic) - `fin exec craft plugin/install seomatic`
- [Freeform](https://github.com/solspace/craft3-freeform) - `fin exec craft plugin/install freeform`
- [Navigation](https://github.com/verbb/navigation) - `fin exec craft plugin/install navigation`

### Mixing Inline Scripts with Vue

[](#mixing-inline-scripts-with-vue)

On occasion we've found the need to run vanilla JS inline within a template (e.g. with Craft Commerce) and only run this code when our Vue app has mounted.

Our solution is to provide an event bus available at `window.app` that is instantiated within the head of the document via `critical.js`. To use the event bus, simply subscribe and publish to events like so:

Example: Subscribing to events

```

  window.app.on("vue-mounted", () => {
    alert("vue has mounted!");
  });

```

Example: Publishing events

```
mounted() {
  window.app.emit("vue-mounted");
}
```

The `vue-mounted` event is provided out of the box to hook into from your twig templates.

Testing
-------

[](#testing)

**Frontend**

The starter comes with [Jest](https://jestjs.io/) installed and configured, plus the [Vue testing framework](https://testing-library.com/docs/vue-testing-library/intro) helper library. To run the test suite, you can use the command

`fin exec npm run test`.

Roadmap
-------

[](#roadmap)

See the [open issues](https://github.com/batchnz/craft/issues) for a list of proposed features (and known issues).

Contributing
------------

[](#contributing)

Contributions are what make the open source community such an amazing place to be learn, inspire, and create. Any contributions you make are **greatly appreciated**.

1. Fork the Project
2. Create your Feature Branch (`git checkout -b feature/AmazingFeature`)
3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`)
4. Push to the Branch (`git push origin feature/AmazingFeature`)
5. Open a Pull Request

License
-------

[](#license)

Distributed under the MIT License. See `LICENSE` for more information.

Contact
-------

[](#contact)

- Jude Reid - [@batchnz](https://twitter.com/batchnz) -
- Alex Hatzipanis - [@hatzipanis](https://twitter.com/hatzipanis) -

Project Link:

Acknowledgements
----------------

[](#acknowledgements)

Thanks to all the hard work by the teams behind the tools used in this project.

###  Health Score

26

—

LowBetter than 43% of packages

Maintenance0

Infrequent updates — may be unmaintained

Popularity15

Limited adoption so far

Community10

Small or concentrated contributor base

Maturity66

Established project with proven stability

 Bus Factor1

Top contributor holds 92.6% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~137 days

Recently: every ~171 days

Total

6

Last Release

1923d ago

Major Versions

v0.2.0 → v1.0.02020-11-05

v1.1.0 → v2.0.02021-02-05

### Community

Maintainers

![](https://www.gravatar.com/avatar/f413fb5cce9ee64c968f0a296bdc43e07f5b3468f17b8a4d9d8c1e18959fb93d?d=identicon)[batch](/maintainers/batch)

---

Top Contributors

[![hatzipanis](https://avatars.githubusercontent.com/u/1661180?v=4)](https://github.com/hatzipanis "hatzipanis (25 commits)")[![judereid](https://avatars.githubusercontent.com/u/549713?v=4)](https://github.com/judereid "judereid (2 commits)")

---

Tags

craft3craftcmsdocksaltailwindcssvuevuejswebpackcmsprojectCraftcraftcms

### Embed Badge

![Health badge](/badges/batch-craft-starter/health.svg)

```
[![Health](https://phpackages.com/badges/batch-craft-starter/health.svg)](https://phpackages.com/packages/batch-craft-starter)
```

###  Alternatives

[wrav/oembed

A simple plugin to extract media information from websites, like youtube videos, twitter statuses or blog articles.

36205.0k3](/packages/wrav-oembed)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)