Zach Barnes zachcb

npm install svg-inline-loader --save-dev

Add it to your loaders in module.loaders section of webpack.config.js:

{
  test: /\.svg$/,
 loader: 'svg-inline-loader'

React (Virtual) DOM Terminology

In React's terminology, there are five core types that are important to distinguish:

ReactElement / ReactElement Factory
ReactNode
ReactComponent / ReactComponent Class

React Elements

How to set up Gulp with an ExpressionEngine project

I freaking love working with technologies like Grunt and Gulp, and wanted to share how to get my current EE front-end workflow set up. With a few tweaks, this can also be used with virtually any other sites (I've used it with Laravel, static sites, Craft, etc).

Install Node.js

If Node is not yet installed on the machine, it will need to be installed

Install Gulp (if needed)

Default

Powerlevel10k

Deploying a subfolder to GitHub Pages

Sometimes you want to have a subdirectory on the master branch be the root directory of a repository’s gh-pages branch. This is useful for things like sites developed with Yeoman, or if you have a Jekyll site contained in the master branch alongside the rest of your code.

For the sake of this example, let’s pretend the subfolder containing your site is named dist.

Step 1

Remove the dist directory from the project’s .gitignore file (it’s ignored by default by Yeoman).

	import path from 'path'
	import vue from '@vitejs/plugin-vue'
	import icons from 'vite-plugin-svg-icons'
	import inspect from 'vite-plugin-inspect'
	import tailwindcss from 'tailwindcss'
	import autoprefixer from 'autoprefixer'
	import createDebugger from 'debug'
	import { defineConfig } from 'laravel-vite'

	export default defineConfig()

	//===============================================================================
	// RECOVERY CALLS
	//===============================================================================

	const express = require('express');
	const app = express();
	const crypto = require('crypto');

	app.get('/recovery', (req, res) => {
	let messages = req.session.flash;

	/* bling.js */
	window.$ = document.querySelector.bind(document);
	window.$$ = document.querySelectorAll.bind(document);
	Node.prototype.on = window.on = function(name, fn) { this.addEventListener(name, fn); };
	NodeList.prototype.__proto__ = Array.prototype;
	NodeList.prototype.on = function(name, fn) { this.forEach((elem) => elem.on(name, fn)); };

	[MASTER]

	# Specify a configuration file.
	#rcfile=

	# Python code to execute, usually for sys.path manipulation such as
	# pygtk.require().
	#init-hook=

	# Profiled execution.

	var context = require.context('.', true, /-test\.js$/) ;
	context.keys().forEach(context) ;
	module.exports = context ;