Am descoperit că Laravel Mix face cam tot ce încercam eu să fac cu Gulp: compilează css, js, copiază lucruri șamd.
Singura treabă ce nu mi-am dat seama (încă) cum aș putea să o rezolv este să conving mix.version() să-mi pună o cale relativă în mix-manifest.json.
Pentru o temă de WP, webpack.mix.js arată așa:
const mix = require('laravel-mix');
const path = require('path')
mix.setPublicPath(path.normalize('.'));
mix.setResourceRoot(path.normalize('assets/dist'));
const sassOptions = {
postCss: [
require('autoprefixer')({
browsers: ['last 2 versions']
}),
require('postcss-custom-properties')
]
};
mix
.js('assets/src/javascripts/index.js', 'assets/dist/javascripts')
.sass('assets/src/stylesheets/style.scss', 'style.css') .options(sassOptions)
mix.sourceMaps(); // Enable sourcemaps
mix.disableNotifications();
Momentan mai folosesc Gulp pentru 3 task-uri ce înlocuiesc diverse string-uri, dar doar pentru că n-am chef timp să migrez. Dar urmează și alea.
Ca să instalezi totul, ai nevoie de următoarele:
npm i cross-env laravel-mix postcss-custom-properties vue-template-compiler sass sass-loader
Ca să rulezi, pune asta în package.json:
"scripts": {
"dev": "npm run development",
"development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"start": "npm run development -- --watch",
"hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --disable-host-check --hot --https --config=node_modules/laravel-mix/setup/webpack.config.js",
"prod": "npm run production",
"production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
},
Din cand in cand ma mai uit pe Laracasts. Take a look
@Cosmin: am cont, e ok