Created
June 12, 2024 18:59
-
-
Save timkelty/6202b8b36f0d45f936d0ec865460e5c6 to your computer and use it in GitHub Desktop.
Craft Cloud + Laravel Mix + Twigpack
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
use craft\helpers\App; | |
return [ | |
// Global settings | |
'*' => [ | |
// If `devMode` is on, use webpack-dev-server to all for HMR (hot module reloading) | |
'useDevServer' => false, | |
// Enforce Absolute URLs on includes | |
'useAbsoluteUrl' => true, | |
// The JavaScript entry from the manifest.json to inject on Twig error pages | |
// This can be a string or an array of strings | |
'errorEntry' => '', | |
// String to be appended to the cache key | |
'cacheKeySuffix' => '', | |
// Manifest file names | |
'manifest' => [ | |
'legacy' => 'mix-manifest.json', | |
'modern' => 'mix-manifest.json', | |
], | |
// Public server config | |
'server' => [ | |
'manifestPath' => \craft\cloud\Helper::artifactUrl('/') ?: '@webroot/', | |
'publicPath' => \craft\cloud\Helper::artifactUrl('dist/'), | |
], | |
// webpack-dev-server config | |
'devServer' => [ | |
'manifestPath' => 'http://localhost:8080/', | |
'publicPath' => 'http://localhost:8080/', | |
], | |
// Bundle to use with the webpack-dev-server | |
'devServerBuildType' => 'modern', | |
// Whether to include a Content Security Policy "nonce" for inline | |
// CSS or JavaScript. Valid values are 'header' or 'tag' for how the CSP | |
// should be included. c.f.: | |
// https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/script-src#Unsafe_inline_script | |
'cspNonce' => '', | |
], | |
// Live (production) environment | |
'live' => [ | |
], | |
// Staging (pre-production) environment | |
'staging' => [ | |
], | |
// Development environment | |
'dev' => [ | |
// If `devMode` is on, use webpack-dev-server to all for HMR (hot module reloading) | |
'useDevServer' => false, | |
], | |
]; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
require('dotenv').config(); | |
let mix = require('laravel-mix'); | |
var tailwindcss = require('tailwindcss'); | |
mix.autoload({ | |
jquery: ['$', 'window.jQuery', 'jQuery'], | |
}); | |
mix.setPublicPath('web') | |
.js(['src/js/app.js'], 'web/dist/app.js') | |
.extract() | |
.vue({ version: 2 }) | |
.sass('src/scss/app.scss', 'dist/app.css') | |
.options({ | |
processCssUrls: false, | |
postCss: [tailwindcss('tailwind.config.js')], | |
}) | |
.copy('src/fonts', 'web/dist/fonts') | |
.options({ | |
fileLoaderDirs: { | |
fonts: 'fonts', | |
}, | |
}) | |
.sourceMaps() | |
.override(function(webpackConfig) { | |
const artifactBaseUrl = process.env.CRAFT_CLOUD_ARTIFACT_BASE_URL; | |
if (artifactBaseUrl) { | |
webpackConfig.output.publicPath = artifactBaseUrl; | |
} | |
return webpackConfig; | |
}); | |
module.exports = { | |
resolve: { | |
alias: { | |
jQuery: 'jquery', | |
}, | |
}, | |
}; | |
mix.browserSync({ | |
proxy: process.env.PRIMARY_SITE_URL, | |
open: false, | |
files: ['web/dist/*.css', 'web/dist/*.js', 'templates/**/*.twig'], | |
}); | |
if (mix.inProduction()) { | |
mix.version(); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment