Skip to content

Instantly share code, notes, and snippets.

@philipboomy
philipboomy / webpack.mix.js
Created May 1, 2018 15:10 — forked from gmcz/webpack.mix.js
Webpack config for Statamic, Tailwind CSS, and PurgeCSS
const {mix} = require('laravel-mix');
const tailwindcss = require('tailwindcss');
const glob = require('glob-all');
const PurgecssPlugin = require('purgecss-webpack-plugin');
mix
.js('js/src/theme-name.js', 'js/theme-name.js')
.sass('sass/theme-name.scss', 'css')
.options({
processCssUrls: false,
@philipboomy
philipboomy / webpack.mix.js
Last active June 8, 2018 17:59
Works with latest laravel-mix
const mix = require('laravel-mix');
const tailwindcss = require('tailwindcss');
require('laravel-mix-purgecss');
mix.postCss('src-css/themename.css', 'css')
.options({
postCss: [tailwindcss('tailwind.js')],
processCssUrls: false,
})
.js([
@philipboomy
philipboomy / purgecss-tailwind-gulp-example.js
Created September 10, 2018 14:32 — forked from taylorbryant/purgecss-tailwind-gulp-example.js
Use PurgeCSS with Tailwind & Gulp (Inspired by @andrewdelprete)
const gulp = require('gulp');
const tailwindConfig = "tailwind.js"; /* Path to Tailwind config */
const mainCSS = "src/style.css"; /* Path to main stylesheet */
/**
* Custom PurgeCSS Extractor
* https://github.com/FullHuman/purgecss
*/
class TailwindExtractor {
static extract(content) {
@philipboomy
philipboomy / gist:b4f22c26cca62f0779714ac97ebe7cb2
Last active October 25, 2019 17:17
Laravel Mix 4 with Tailwind and Purge
const mix = require('laravel-mix');
const tailwindcss = require('tailwindcss');
require('laravel-mix-purgecss');
mix.setPublicPath('./web')
.postCss('src/css/main.css', 'css')
.options({
postCss: [tailwindcss('tailwind.config.js'), require('autoprefixer')],
processCssUrls: false,
})
@philipboomy
philipboomy / statamic-laravel-mix-4.txt
Created March 14, 2019 16:31
Statamic Laravel Mix 4
const mix = require('laravel-mix');
const tailwindcss = require('tailwindcss');
require('laravel-mix-purgecss');
mix.setPublicPath('./public/themes/themename')
mix.postCss('src/default-src.css', 'css/themename.css')
.options({
postCss: [tailwindcss('tailwind.config.js')],
processCssUrls: false,
})
import qs from 'qs';
import Axios from 'axios';
Axios.defaults.baseURL = Craft.baseUrl;
Axios.defaults.headers.common['Accept'] = 'application/json';
Axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
Axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
Axios.interceptors.request.use(config => {
if (config.data instanceof FormData) {
@philipboomy
philipboomy / CreateAccountForm.vue
Created March 27, 2019 15:15 — forked from jakedohm/CreateAccountForm.vue
A Vue component to handle submitting account creation details with Axios, instead of with a standard HTML form
<template>
<form method="post" accept-charset="UTF-8">
<h3><label for="username">Username</label></h3>
<input v-model="username" id="username" type="text" name="username" />
<h3><label for="email">Email</label></h3>
<input v-model="email" id="email" type="text" name="email" />
<h3><label for="password">Password</label></h3>
<input v-model="password" id="password" type="password" name="password" />
@philipboomy
philipboomy / payment.html
Created March 30, 2019 19:12 — forked from peteeveleigh/payment.html
Basic method for doing custom Stripe checkout form with Craft Commerce
{% if cart.paymentMethodId %}
<form method="POST" class="form" {% if cart.paymentMethod.class == 'Stripe' %}id="payment-form"{% endif %}>
<input type="hidden" name="action" value="commerce/payments/pay"/>
<input type="hidden" name="redirect" value="/checkout/complete?number={number}"/>
<input type="hidden" name="cancelUrl" value="/checkout/cancelled"/>
{{ getCsrfInput() }}
{% if errors is defined %}
<?php
// Element API endpoint
'news.json' => function() {
return [
'elementType' => Entry::class,
'criteria' => [
'section' => 'news'
'join' => [
[
'LEFT JOIN',
@philipboomy
philipboomy / webpack.mix.js
Created April 20, 2020 12:01 — forked from julienbourdeau/webpack.mix.js
Laravel Mix with multiple Tailwind config and PurgeCSS (separate Admin dashboard and Front app)
const mix = require('laravel-mix');
const tailwindcss = require('tailwindcss');
const rootPath = Mix.paths.root.bind(Mix.paths);
const tailwindPlugins = function(configFile, paths) {
const pluginList = [tailwindcss(configFile)];
if (mix.inProduction()) {
pluginList.push(require('@fullhuman/postcss-purgecss')({