Dive into secure and efficient coding practices with our curated list of the top 10 examples showcasing 'laravel-mix' in functional components in JavaScript. Our advanced machine learning engine meticulously scans each line of code, cross-referencing millions of open source libraries to ensure your implementation is not just functional, but also robust and secure. Elevate your React applications to new heights by mastering the art of handling side effects, API calls, and asynchronous operations with confidence and precision.
}
})
mix.setResourceRoot('./')
if (mix.config.hmr) {
// Somehow public/hot isn't being removed by Mix. We'll handle it ourselves.
process.on('SIGINT', () => {
try {
fs.unlinkSync(mix.config.publicPath + '/hot')
} catch (e) {
}
process.exit()
})
} else {
mix.copy('resources/assets/img', 'public/img', false)
.copy('node_modules/font-awesome/fonts', 'public/fonts', false)
}
mix.ts('resources/assets/js/app.ts', 'public/js')
.sass('resources/assets/sass/app.scss', 'public/css')
.ts('resources/assets/js/remote/app.ts', 'public/js/remote')
.sass('resources/assets/sass/remote.scss', 'public/css')
if (mix.config.production) {
mix.version()
mix.disableNotifications()
}
/*
|--------------------------------------------------------------------------
| 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.options({ processCssUrls: false });
// versions
mix.version([
'public/assets/js/vendor.js',
'public/assets/js/mobile.main.js',
'public/assets/js/console.main.js',
'public/assets/js/app.main.js',
'public/assets/css/app.main.css',
'public/assets/css/console.main.css',
'public/assets/css/mobile.main.css',
'public/assets/js/manifest.js',
'public/assets/css/app.vendor.css',
'public/assets/css/console.vendor.css',
'public/assets/css/mobile.vendor.css',
'public/assets/js/app.vendor.js',
'public/assets/js/console.vendor.js',
'public/assets/js/mobile.vendor.js',
'public/assets/css/app.theme.css',
'public/assets/js/app.theme.js',
let mix = require("laravel-mix");
let tailwind = require("tailwindcss");
require("laravel-mix-purgecss");
mix
.js("resources/js/app.js", "public/js")
.postCss("resources/css/animate.css", "public/css")
.postCss("resources/css/cronmon.css", "public/css", [
tailwind("tailwind.js")
]);
// .purgeCss();
let glob = require('glob-all')
let PurgecssPlugin = require('purgecss-webpack-plugin')
class TailwindExtractor {
static extract (content) {
return content.match(/[A-Za-z0-9-_:\/]+/g) || []
}
}
mix.postCss('resources/assets/css/main.css', 'public/css', [
require('tailwindcss')
]).minify('public/css/main.css')
mix.copy('resources/assets/css/editor.css', 'public/css/editor.css').minify('public/css/editor.css')
mix.js('resources/assets/js/pages/auth/login.js', 'public/js/auth').minify('public/js/auth/login.js')
.js('resources/assets/js/pages/auth/register.js', 'public/js/auth').minify('public/js/auth/register.js')
.js('resources/assets/js/pages/errors/404.js', 'public/js/errors').minify('public/js/errors/404.js')
.js('resources/assets/js/pages/projects/single.js', 'public/js/projects').minify('public/js/projects/single.js')
.js('resources/assets/js/pages/teams/single.js', 'public/js/teams').minify('public/js/teams/single.js')
.js('resources/assets/js/pages/offices/single.js', 'public/js/offices').minify('public/js/offices/single.js')
.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);
| Dcat Admin assets
|--------------------------------------------------------------------------
*/
mix.copyDirectory('resources/assets/images', distPath + '/images');
mix.copyDirectory('resources/assets/fonts', distPath + '/fonts');
mix.copyDirectory('resources/assets/vendors', distPath + '/vendors');
// AdminLTE3.0
mix.sass('resources/assets/adminlte/scss/AdminLTE.scss', themeCss('adminlte/adminlte')).sourceMaps();
mix.js('resources/assets/adminlte/js/AdminLTE.js', distPath + '/adminlte/adminlte.js').sourceMaps();
// 复制第三方插件文件夹
mix.copyDirectory(dcatPath('plugins'), dcatDistPath('plugins'));
// 打包app.js
mix.js(dcatPath('js/dcat-app.js'), dcatDistPath('js/dcat-app.js')).sourceMaps();
// 打包app.scss
mix.sass(dcatPath('sass/dcat-app.scss'), themeCss('dcat/css/dcat-app')).sourceMaps();
// 打包所有 extra 里面的所有js和css
mixAssetsDir('dcat/extra/*.js', (src, dest) => mix.js(src, dest));
mixAssetsDir('dcat/extra/*.scss', (src, dest) => {
if (theme) {
return mix.sass(src, dest.replace('\.scss', '-'+theme+'.css'))
}
return mix.sass(src, dest.replace('scss', 'css'))
});
// 皮肤
// mixAssetsDir('dcat/sass/skins/*.scss', (src, dest) => {
// if (theme) {
mix.sass('resources/assets/js/vendor/tinymce/skins/boilerplate/skin.scss', 'public/js/tinymce/skins/ui/boilerplate/skin.min.css');
mix.sass('resources/assets/js/vendor/tinymce/skins/boilerplate/skin.mobile.scss', 'public/js/tinymce/skins/ui/boilerplate/skin.mobile.min.css');
// https://www.tiny.cloud/get-tiny/language-packages/
mix.copy('resources/assets/js/vendor/tinymce/langs', 'public/js/tinymce/langs');
mix.scripts([
'node_modules/tinymce/tinymce.min.js',
'node_modules/tinymce/jquery.tinymce.min.js'
], 'public/js/tinymce/tinymce.min.js').version();
// ============== FullCalendar ==============
mix.copy('node_modules/fullcalendar/main.min.css', 'public/js/fullcalendar/main.min.css').version();
mix.copy('node_modules/fullcalendar/main.min.js', 'public/js/fullcalendar/main.min.js').version();
mix.copy('node_modules/fullcalendar/locales/*', 'public/js/fullcalendar/locales').version();
mix.js('resources/assets/js/vendor/fullcalendar/jquery.fullcalendar.js', 'public/js/fullcalendar/jquery.fullcalendar.min.js').version();
// octicons
mix.sass('node_modules/octicons/build/font/_octicons.scss', 'css/vendor/octicons.css');
// Bootstrap Select
mix.copy('node_modules/bootstrap-select/dist/css/bootstrap-select.min.css', 'www/media/css/vendor/bootstrap-select.css');
mix.copy('node_modules/bootstrap-select/dist/js/bootstrap-select.min.js', 'www/media/js/vendor/bootstrap-select.js');
// jQuery Caret (Caret.js)
mix.copy('node_modules/jquery.caret/dist/jquery.caret.min.js', 'www/media/js/vendor/jquery.caret.js');
// At.js (jquery.atwho)
mix.copy('node_modules/at.js/dist/css/jquery.atwho.min.css', 'www/media/css/vendor/jquery.atwho.css');
mix.copy('node_modules/at.js/dist/js/jquery.atwho.min.js', 'www/media/js/vendor/jquery.atwho.js');
// jQuery Textrange
mix.copy('node_modules/jquery-textrange/jquery-textrange.js', 'www/media/js/vendor/jquery-textrange.js');
// Build site resources
mix.sass('assets/scss/jtracker.scss', 'css/jtracker.css');
mix.sass('assets/scss/jtracker-rtl.scss', 'css/jtracker-rtl.css');
mix.sass('assets/scss/markitup.scss', 'css/markitup/skins/tracker/style.css');
mix.js('assets/js/color-select.js', 'js/color-select.js');
mix.js('assets/js/jtracker.js', 'js/jtracker.js');
mix.js('assets/js/jtracker-tmpl.js', 'js/jtracker-tmpl.js');
mix.js('assets/js/uploader-img.js', 'js/uploader-img.js');
mix.js('assets/js/support/documentation-index.js', 'js/support/documentation-index.js');
mix.js('assets/js/text/article-edit.js', 'js/text/article-edit.js');
mix.js('assets/js/text/articles-index.js', 'js/text/articles-index.js');
// Copy angularjs files to build directory.
mix.copy('public/views/*.html', 'public/build/views/');
// Cache busting for angularjs partials.
var glob = require("glob");
glob.sync('public/views/partials/*.html').forEach(function(src) {
var dest = src.replace('.html', '_' + version + '.html');
var dest = dest.replace('views', 'build/views');
mix.copy(src, dest);
});
// Version CSS files.
mix.copy('public/css/cdash.css', 'public/build/css/cdash_' + version + '.css');
mix.copy('public/css/colorblind.css', 'public/build/css/colorblind_' + version + '.css');
mix.copy('public/css/common.css', 'public/build/css/common.css');
mix.styles([
'node_modules/bootstrap/dist/css/bootstrap.css',
'node_modules/bootstrap-vue/dist/bootstrap-vue.css'
], 'public/build/css/3rdparty.css').version();
// Concatenate and minify 3rd party javascript.
mix.scripts([
'public/js/jquery-1.10.2.js',
'public/js/jquery-ui-1.10.4.min.js',
'public/js/jquery.cookie.js',
'public/js/jquery.flot.min.js',
'public/js/jquery.flot.navigate.min.js',
'public/js/jquery.flot.selection.min.js',
'public/js/jquery.flot.symbol.min.js',
'public/js/jquery.flot.time.min.js',
'public/js/jquery.qtip.min.js',
], 'public/js/datatables/datatables.min.js').version();
mix.copy('node_modules/drmonty-datatables-plugins/i18n', 'public/js/datatables/i18n/', false);
mix.styles(
'node_modules/datatables.net-bs4/css/dataTables.bootstrap4.css',
'public/js/datatables/datatables.min.css'
).version();
// ============== Select2 ==============
mix.scripts([
'node_modules/select2/dist/js/select2.full.min.js'
], 'public/js/select2/select2.full.min.js').version();
mix.copy('node_modules/select2/dist/js/i18n', 'public/js/select2/i18n/', false);
// ============== DatePicker ==============
mix.sass('resources/assets/scss/daterangepicker.scss', 'public/js/datepicker/datepicker.min.css').version();
mix.scripts([
'node_modules/admin-lte/plugins/tempusdominus-bootstrap-4/js/tempusdominus-bootstrap-4.js',
'node_modules/admin-lte/plugins/daterangepicker/daterangepicker.js',
], 'public/js/datepicker/datepicker.min.js').version();
// ============== FileInput ==============
mix.sass(
'node_modules/bootstrap-fileinput/scss/fileinput.scss',
'public/js/fileinput/bootstrap-fileinput.min.css'
// jQuery Validation
mix.copy('node_modules/jquery-validation/dist/jquery.validate.min.js', 'www/media/js/vendor/jquery-validation.js');
// markItUp!
mix.copy('node_modules/markItUp!/markitup', 'www/media/markitup');
// twbs-pagination
mix.copy('node_modules/twbs-pagination/jquery.twbsPagination.min.js', 'www/media/js/vendor/twbs-pagination.js');
// Bootstrap Datepicker
mix.copy('node_modules/bootstrap-datepicker/dist/css/bootstrap-datepicker.min.css', 'www/media/css/vendor/bootstrap-datepicker.css');
mix.copy('node_modules/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js', 'www/media/js/vendor/bootstrap-datepicker.js');
mix.copy('node_modules/bootstrap-datepicker/dist/locales/bootstrap-datepicker.en-GB.min.js', 'www/media/js/vendor/bootstrap-datepicker/locales/bootstrap-datepicker.en-GB.js');
// d3
mix.copy('node_modules/d3/d3.min.js', 'www/media/js/vendor/d3.js');
// octicons
mix.sass('node_modules/octicons/build/font/_octicons.scss', 'css/vendor/octicons.css');
// Bootstrap Select
mix.copy('node_modules/bootstrap-select/dist/css/bootstrap-select.min.css', 'www/media/css/vendor/bootstrap-select.css');
mix.copy('node_modules/bootstrap-select/dist/js/bootstrap-select.min.js', 'www/media/js/vendor/bootstrap-select.js');
// jQuery Caret (Caret.js)
mix.copy('node_modules/jquery.caret/dist/jquery.caret.min.js', 'www/media/js/vendor/jquery.caret.js');
// At.js (jquery.atwho)
mix.copy('node_modules/at.js/dist/css/jquery.atwho.min.css', 'www/media/css/vendor/jquery.atwho.css');
mix.copy('node_modules/at.js/dist/js/jquery.atwho.min.js', 'www/media/js/vendor/jquery.atwho.js');
// jQuery Textrange