This is a minimal Kirby 3 local development scaffolding.
- Gulp to transform css & js assets, including Webpack and Babel
- TailwindCSS as a CSS framework to speed up development
- browser-sync to automatically reload your site when files are changed
This setup requires:
- node & npm
- composer
- A server running Nginx with root set to
html/public
. If you want to use Apache instead, download the .htaccess file from the Kirby plainkit and put it inhtml/public
Clone this repo:
git clone https://github.com/philipmarnef/k3-scaffold.git --depth 1 <project-folder>
-
update the package.json file with your project info
-
run
./install.zsh
OR manually- edit the
baseUrl
ingulpfile.esm.js
to the url your local site is running on, likehttp://my-site.test
orhttp://localhost:4000
. - update the 'robots' conditional in
snippets/head.php
to the production url - install Node modules & Kirby composer packages:
# Install node modules: npm install # Install Kirby: cd html composer install
- edit the
-
Run the Kirby installer at
http://my-site.test/panel
.
To start watching, run the serve
task from the root directory:
npm run serve
This will start a proxy server with browsersync at localhost:3000
, refreshing the browser page on file changes.
See gulpfile.esm.js
for details.
To build your assets for production:
npm run build
This removes sourcemaps and minifies the assets.