Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
// 🎚️ Source folders
const source = {
icons: path.resolve("src/icons"),
images: path.resolve("src/images"),
scripts: path.resolve("src/scripts"),
styles: path.resolve("src/styles"),
static: path.resolve("src/static"),
templates: path.resolve("src/templates"),
}
// 🎚️ Misc
mix.setPublicPath(config.publicFolder)
mix.disableNotifications()
mix.webpackConfig({ resolve: { alias: source } })
!mix.inProduction() && mix.sourceMaps()
/**
* 🏠 Templates (for static sites)
* Convert Twig files to Html
* https://github.com/ben-rogerson/laravel-mix-twig-to-html
*/
if (config.buildStaticSite && source.templates) {
require("laravel-mix-twig-to-html")
mix.twigToHtml({
files: [
{
template: path.resolve(
__dirname,
source.templates,
"**/*.{twig,html}"
),
.js('resources/assets/js/pages/users/profile.js', 'public/js/users').minify('public/js/users/profile.js')
.js('resources/assets/js/pages/users/settings.js', 'public/js/users').minify('public/js/users/settings.js')
.js('resources/assets/js/pages/admin/index.js', 'public/js/admin').minify('public/js/admin/index.js')
.js('resources/assets/js/pages/home.js', 'public/js').minify('public/js/home.js')
.extract(['vue', 'axios', 'luxon'])
// Full API
// mix.js(src, output);
// mix.extract(vendorLibs);
// mix.sass(src, output);
// mix.less(src, output);
// mix.combine(files, destination);
// mix.copy(from, to);
// mix.minify(file);
mix.minify('public/js/vendor.js')
if (!mix.inProduction()) {
mix.sourceMaps() // Enable sourcemaps
}
mix.disableNotifications()
// mix.setPublicPath('path/to/public'); <-- Useful for Node apps.
// mix.webpackConfig({}); <-- Override webpack.config.js, without editing the file directly.
mix.webpackConfig(
{
devtool: 'inline-source-map'
},
{
resolve: {
alias: {
'vue$': mix.inProduction() ? 'vue/dist/vue.min.js' : 'vue/dist/vue.js'
}
}
}
) === 0
)
}
})
)
plugins.push(
// extract webpack runtime and module manifest to its own file in order to
// prevent vendor hash from being updated whenever app bundle is updated
new webpack.optimize.CommonsChunkPlugin({
name: 'manifest',
minChunks: Infinity
})
)
if (mix.inProduction()) {
plugins.push(
new webpack.DefinePlugin({
'process.env': env
})
)
plugins.push(
// This instance extracts shared chunks from code splitted chunks and bundles them
// in a separate chunk, similar to the vendor chunk
// see: https://webpack.js.org/plugins/commons-chunk-plugin/#extra-async-commons-chunk
new webpack.optimize.CommonsChunkPlugin({
name: 'app.chunkFilename',
async: 'vendor-async',
children: true,
minChunks: 3
})
const mix = require('laravel-mix');
/*
|--------------------------------------------------------------------------
| Mix Asset Management
|--------------------------------------------------------------------------
|
| Mix provides a clean, fluent API for defining some Webpack build steps
| for your Laravel application. By default, we are compiling the Sass
| file for the application as well as bundling up all the JS files.
|
*/
mix.js('resources/js/app.es6', 'public/js')
.sourceMaps(!mix.inProduction())
.extract([
'axios',
'bootstrap',
'jquery',
'lodash',
'popper.js',
'vue'
])
.version();
mix.sass('resources/sass/app.scss', 'public/css')
.version();
clearConsole: false,
cssNano: {
minifyFontValues: false,
discardComments: {removeAll: true},
zindex: false,
},
hmrOptions: {
host: 'localhost',
port: 3000,
},
processCssUrls: false,
purifyCss: false,
terser: {
terserOptions: {
compress: {
drop_console: mix.inProduction(),
},
mangle: {
properties: {regex: /[a-zA-Z]+_$/}
},
},
},
});
mix.webpackConfig({
resolve: {
alias: {'@': path.resolve(__dirname, '+/scripts/')},
modules: ['node_modules'],
},
});
mix
const mix = require('laravel-mix');
mix.setPublicPath("app");
mix.react('ui/index.js', 'bundle.js')
.sass('ui/index.scss', 'bundle.css')
if (!mix.inProduction()) {
mix.webpackConfig({
devtool: 'source-map'
})
.sourceMaps()
}
`${assets_path}/js/utils/uploader.js`,
], `${dist_path}/js/app.js`)
.styles([
`${paths.select2}/dist/css/select2.min.css`,
`${paths.morris}/morris.css`,
`${paths.ionicons}/css/ionicons.min.css`,
`${paths.toastr}/build/toastr.min.css`,
`${paths.cropper}/dist/cropper.min.css`
], `${dist_path}/css/vendor.css`)
.sass(`${assets_path}/sass/app.scss`, `${dist_path}/css/app.css`);
if (mix.inProduction()) {
mix.version();
}
if (!mix.inProduction()) {
mix.sourceMaps()
mix.browserSync({proxy: 'piplin.app'})
}
module: {
rules: [
{
test: /.(vue|jsx|js)$/,
loader: 'eslint-loader',
enforce: 'pre',
exclude: /node_modules/,
options: {
cache: true,
configFile: '.eslintrc',
},
},
],
},
plugins: [
new StyleLintPlugin({ lintDirtyModulesOnly: !mix.inProduction() }),
],
});
* 🏠 Templates (for static sites)
* Convert Twig files to Html
* https://github.com/ben-rogerson/laravel-mix-twig-to-html
*/
if (config.buildStaticSite && source.templates) {
require("laravel-mix-twig-to-html")
mix.twigToHtml({
files: [
{
template: path.resolve(
__dirname,
source.templates,
"**/*.{twig,html}"
),
minify: {
collapseWhitespace: mix.inProduction(),
removeComments: mix.inProduction(),
},
},
],
fileBase: source.templates,
twigOptions: {
data: require(path.join(source.templates, "_data", "data.js")),
},
})
}
/**
* 🎭 Hashing (for non-static sites)
* Mix has querystring hashing by default, eg: main.css?id=abcd1234
* This script converts it to filename hashing, eg: main.abcd1234.css
* https://github.com/JeffreyWay/laravel-mix/issues/1022#issuecomment-379168021
|--------------------------------------------------------------------------
| Mix Asset Management
|--------------------------------------------------------------------------
|
| Mix provides a clean, fluent API for defining some Webpack build steps
| for your Laravel application. By default, we are compiling the Sass
| file for the application as well as bundling up all the JS files.
|
*/
mix.js('resources/assets/js/app.js', 'public/js')
.sass('resources/assets/sass/app.scss', 'public/css')
.version();
if (! mix.inProduction()) {
mix.sourceMaps();
mix.webpackConfig(
{
devtool: "inline-source-map"
}
);
}