Mikail.Net

Yazılımcı günlüğü

Laravel mix 6

Laravel Mix 6, web uygulama geliştiricilerine frontend varlıklarını (CSS, JavaScript, SASS ve daha fazlası) kolayca yönetme ve derleme olanağı sağlayan popüler bir Laravel eklentisidir. Laravel projesine Laravel Mix 6 ekleme, projenizin kodlarını optimize etmeye ve performansını artırmaya yardımcı olur. Bu eklenti, Webpack modül paketleyici üzerine kurulmuştur ve geliştiricilere, uygulama varlıklarını doğru şekilde işlemek ve optimize etmek için kullanıcı dostu bir API sunar. Laravel Mix 6’yı projenize eklemek için öncelikle paket yöneticisi olan Composer veya NPM aracılığıyla kurulum gerçekleştirebilirsiniz. Daha sonra, Mix yapılandırma dosyası olan webpack.mix.js dosyasını projenizin kök dizinine ekleyerek ayarlarını özelleştirebilir ve farklı ortamlar için optimize edebilirsiniz. Son olarak, komut satırında npm run dev veya npm run production komutlarını çalıştırarak, derleme sürecini başlatabilir ve projenizin geliştirme veya üretim ortamında kullanıma hazır hale gelmesini sağlayabilirsiniz.

npm install
npm install laravel-mix@latest
npm install laravel-mix --save-dev
{
    "private": true,
    "scripts": {
        "dev": "npm run development",
        "build": "vite build",
        "development": "mix",
        "watch": "mix watch",
        "watch-poll": "mix watch -- --watch-options-poll=1000",
        "hot": "mix watch --hot",
        "prod": "npm run production",
        "production": "mix --production"
    },
    "devDependencies": {
        "axios": "^1.1.2",
        "laravel-mix": "^6.0.49",
        "laravel-vite-plugin": "^0.7.2",
        "resolve-url-loader": "^5.0.0",
        "sass": "^1.62.0",
        "sass-loader": "^12.6.0",
        "vite": "^4.0.0"
    }
}
touch webpack.mix.js
let mix = require('laravel-mix');
mix.js('resources/js/app.js', 'js').sass('resources/sass/app.scss', 'css');

ERROR in /js/app
Module not found: Error: Can’t resolve ‘/resources/sass/app.scss’ in ‘/’
Did you miss the leading dot in ‘resolve.extensions’? Did you mean ‘[“.“,”.wasm”,”.mjs”,”.js”,”.jsx”,”.json”]’ instead of ‘[““,”.wasm”,”.mjs”,”.js”,”.jsx”,”.json”]’?

bu hatanin nedeni bu dosyanin olmamasi

resources/sass/app.scss