https://github.com/enricodeleo/vueird

:gear: A clean WordPress starter theme powered by Vue and WebPack with developer experience in mind
https://github.com/enricodeleo/vueird

boilerplate developer-tools livereload node npm starter-template theme vue webpack wordpress

Last synced: 2 months ago
JSON representation

:gear: A clean WordPress starter theme powered by Vue and WebPack with developer experience in mind

• Host: GitHub
• URL: https://github.com/enricodeleo/vueird
• Owner: enricodeleo
• Created: 2019-04-27T14:25:01.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2023-02-28T16:21:35.000Z (almost 2 years ago)
• Last Synced: 2023-04-30T20:41:28.464Z (over 1 year ago)
• Topics: boilerplate, developer-tools, livereload, node, npm, starter-template, theme, vue, webpack, wordpress
• Language: PHP
• Homepage:
• Size: 1000 KB
• Stars: 35
• Watchers: 6
• Forks: 7
• Open Issues: 15
• Metadata Files:
  • Readme: README.md
  • Funding: .github/FUNDING.yml

Awesome Lists containing this project

README

        

![Vueird Logo](./vueird.jpg)

_Thanks to everyone having starred my repo! If you like this project, please consider your star_

[![Stargazers repo roster for @enricodeleo/vueird](https://reporoster.com/stars/enricodeleo/vueird)](https://github.com/enricodeleo/vueird/stargazers)

# Vueird

A WordPress starter theme that embraces today's practices: npm, webpack, livereload, declarative manipulation (Vue :heart:).

## Requirements

* Node.js

* Npm

## Installation

1. Clone this repository into your theme folder.

2. Open it in a shell and run `npm install`.

3. Activate the theme.

## Features

* Write modern Javascript. Babel does the rest

* Live reload

* SCSS

* Declarative DOM manipulation/events thanks to Vue

* Delightful developer experience through my _fake js router_ that attaches the right component to the right page.

## Develop

In order to take advantage of livereload, you need to target your wordpress development url in `./scripts/webpack.config.js` line 149 (e.g. localhost:8080, testsite.dev etc).

`npm start`

## Build for production

`npm run build`

## Refresh editor style

This theme generates a custom editor style used by the WordPress editor/Gutenberg that you can write in SCSS (`./src/editor-style.scss`).

`npm run editorstyle`

_________________________________________

## Author

[Enrico Deleo](https://enricodeleo.com)

# Are you looking for a modern, robust, portable WordPress development environment?

[Look no further, try my Wpacked WordPress development starter kit](https://github.com/enricodeleo/wpacked/)