Laravel Mix

Laravel Mix

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"
    },

2 Comentarii

Adaugă un comentariurăspuns pentru

Poți adăuga bucăți de cod folosind [code]codul tău aici[/code], [js][/js], [php][/php] etc.

Link-urile în context sunt binevenite. Comentariile fără nume/email valid sunt șterse.
PS: Comentariul NU este editabil.

Acest site folosește Akismet pentru a reduce spamul. Află cum sunt procesate datele comentariilor tale.

Site-ul blog.iamntz.com utilizează cookie-uri. Continuarea navigării presupune acceptarea lor. Mai multe informații.

windows apple dropbox facebook twitter