ciungulete's avatar

Laravel mix extract problem

I have this webpack.mix.js

    [
    'resources/js/vendor/jquery.js',
    'resources/js/vendor/bootstrap.bundle.js',
    'resources/js/vendor/jquery.slimscroll.js',
    'resources/js/vendor/metisMenu.js',
    'resources/js/vendor/waves.js',
    'resources/js/vendor/jquery.waypoints.min.js',
    'resources/js/vendor/jquery.counterup.min.js',
    ],
    'public/js/andali.js');
mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css')
   .extract()
   .version()
   .copyDirectory('resources/fonts', 'public/fonts')
   .copyDirectory('resources/images', 'public/images');

In /public/js/vendor.js I have only this code

(window["webpackJsonp"] = window["webpackJsonp"] || []).push([["/js/vendor"],[]]);

What i do wrong?

Thanks

0 likes
7 replies
ciungulete's avatar

For first npm run dev vendor it's ok. If i run again vendor has only (window["webpackJsonp"] = window["webpackJsonp"] || []).push([["/js/vendor"],[]]);

munazzil's avatar

Use as like below in your app.blade.php.

                <script src="{{ mix('js/app.js') }}"></script>

and type below command

                     npm update
                     npm run dev
ciungulete's avatar
/js/vendor.js  82 bytes    /js/vendor  [emitted]  /js/vendor

and in the package.json i have

{
    "private": true,
    "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",
        "watch": "npm run development -- --watch",
        "watch-poll": "npm run watch -- --watch-poll",
        "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --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"
    },
    "devDependencies": {
        "axios": "^0.18",
        "browser-sync": "^2.18.12",
        "cross-env": "^5.1",
        "laravel-mix": "^4.0.4",
        "lodash": "^4.17.5",
        "sass": "^1.15.2",
        "sass-lint": "^1.10.2",
        "sass-loader": "^7.1.0",
        "vue": "^2.5.21"
    },
    "dependencies": {
        "@google/maps": "^0.4.6",
        "RWD-Table-Patterns": "^5.3.3",
        "admin-resources": "git+https://github.com/coderthemes/admin-resources.git#master",
        "animate.css": "^3.7.0",
        "autonumeric": "^1.9.39",
        "bootstrap": "^4.1.3",
        "bootstrap-colorpicker": "^3.0.3",
        "bootstrap-maxlength": "^1.6.0",
        "bootstrap-select": "^1.13.5",
        "bootstrap-table": "^1.12.1",
        "bootstrap-touchspin": "^4.2.5",
        "c3": "^0.6.7",
        "chart.js": "^2.7.2",
        "chartist": "^0.11.0",
        "chartist-plugin-tooltips": "0.0.17",
        "clockpicker": "0.0.7",
        "cropper": "^4.0.0",
        "custombox": "^4.0.3",
        "d3": "^5.7.0",
        "datatables.net": "^1.10.16",
        "datatables.net-bs4": "^1.10.16",
        "datatables.net-buttons": "^1.4.2",
        "datatables.net-buttons-bs4": "^1.4.2",
        "datatables.net-keytable": "^2.3.2",
        "datatables.net-keytable-bs4": "^2.3.2",
        "datatables.net-responsive": "^2.2.1",
        "datatables.net-responsive-bs4": "^2.2.1",
        "datatables.net-select": "^1.2.5",
        "datatables.net-select-bs4": "^1.2.5",
        "devbridge-autocomplete": "^1.4.9",
        "dropify": "^0.2.2",
        "dropzone": "^5.5.1",
        "flatpickr": "^4.5.2",
        "flot-charts": "^0.8.3",
        "flot-orderbars": "^1.0.0",
        "footable": "^2.0.6",
        "fullcalendar": "^3.9.0",
        "gmaps": "^0.4.24",
        "hopscotch": "^0.3.1",
        "imagemin": "^6.0.0",
        "ion-rangeslider": "^2.3.0",
        "jquery": "^3.3.1",
        "jquery-countdown": "^2.2.0",
        "jquery-knob": "^1.2.11",
        "jquery-mapael": "^2.2.0",
        "jquery-mask-plugin": "^1.14.15",
        "jquery-mockjax": "^2.5.0",
        "jquery-nice-select": "^1.1.0",
        "jquery-slimscroll": "^1.3.8",
        "jquery-sparkline": "^2.4.0",
        "jquery-tabledit": "^1.0.0",
        "jquery-toast-plugin": "^1.3.2",
        "jquery-ui": "git+https://github.com/components/jqueryui.git#1.11.4",
        "jquery.counterup": "^2.1.0",
        "jquery.flot.tooltip": "^0.9.0",
        "jquery.scrollto": "^2.1.2",
        "jsgrid": "^1.5.3",
        "justgage": "^1.2.2",
        "katex": "^0.10.0-rc.1",
        "ladda": "^1.0.6",
        "magnific-popup": "^1.1.0",
        "metismenu": "^2.7.4",
        "mohithg-switchery": "^0.8.4",
        "moment": "^2.22.2",
        "morris.js": "^0.5.0",
        "multiselect": "^0.9.12",
        "nestable2": "^1.6.0",
        "node-waves": "^0.7.6",
        "parsleyjs": "^2.8.1",
        "pdfmake": "^0.1.38",
        "peity": "^3.3.0",
        "popper.js": "^1.14.3",
        "quill": "^1.3.6",
        "raphael": "^2.2.7",
        "rickshaw": "^1.6.6",
        "select2": "^4.0.6-rc.1",
        "summernote": "^0.8.10",
        "sweetalert2": "^7.28.2",
        "tablesaw": "^3.0.9",
        "tippy.js": "^2.5.4",
        "toastr": "^2.1.4",
        "twitter-bootstrap-wizard": "^1.2.0",
        "waypoints": "^4.0.1",
        "x-editable": "^1.5.1"
    }
}

munazzil's avatar

Use as like below then.and run above commands in cmd.

    <script src="{{ mix('js/vendor.js') }}"></script>
ciungulete's avatar

I have this

<script src="{{ mix('js/andali.js') }}"></script>
<script src="{{ mix('js/manifest.js') }}"></script>
<script src="{{ mix('js/vendor.js') }}"></script>
<script src="{{ mix('js/app.js') }}"></script>

and webpack file is this

mix.combine([
        'resources/js/andali/jquery.js',
        'resources/js/andali/bootstrap.bundle.js',
        'resources/js/andali/jquery.slimscroll.js',
        'resources/js/andali/metisMenu.js',
        'resources/js/andali/waves.js',
        'resources/js/andali/jquery.waypoints.min.js',
        'resources/js/andali/jquery.counterup.min.js'
    ],'public/js/andali.js');
mix.js('resources/js/app.js', 'public/js')
   .sass('resources/scss/app.scss', 'public/css')
   .extract()
   .options({
      processCssUrls: false
   })
   .sourceMaps()
   .copyDirectory('resources/fonts', 'public/fonts')
   .copyDirectory('resources/images', 'public/images');
kapitan's avatar

i guess that it worked because you removed the .version()

Please or to participate in this conversation.