Функция версии не работает для файлов JS в Laravel Mix - PullRequest
Новая
       13

Функция версии не работает для файлов JS в Laravel Mix

2 голосов
/ 16 июня 2019

Я написал следующий код, который совмещал файлы CSS и JS с файлом Webpack.mix.js и правильным результатом, но функция версии не работает для файла JS! Что я могу сделать, чтобы сделать это правильно, и CSS и JS стали версией?

webpack.mix.js 

mix.setPublicPath('/')
    .copy('node_modules/bootstrap/dist/js/bootstrap.js', 'resources/js')
    .copy('node_modules/jquery/dist/jquery.js', 'resources/js')
    .scripts([
        'resources/js/bootstrap.js',
        'resources/js/jquery.js'
    ], 'resources/js/app.js');

mix.sass('resources/sass/app.scss', 'public/css')
    .styles([
        'public/css/app.css',
        'public/css/myCss.css'
    ], 'public/css/all.css')
    .js('resources/js/app.js', 'public/js')
    .version();

смешайте-manifest.json 

{
    "/css/app.css": "/css/app.css?id=35978cdc6a38f7d64fbb",
    "/css/all.css": "/css/all.css?id=eda19119aa76ef087fde"
}

я добавил <script src="{{ mix('js/all.js') }}"></script> в мой файл Blade

1 Ответ

0 голосов
/ 16 июня 2019

Вместо этого создайте свою конфигурацию webpack.mix.js следующим образом. 

mix.js('resources/js/app.js', 'public/js')
    .sass('resources/sass/app.scss', 'public/css')
    .styles([
        'public/css/myCss.css'
    ], 'public/css/all.css')
    .version();

Убедитесь, что установлены jQuery и Bootstrap.Вы также можете обновить Laravel Mix до последней версии. 

npm install bootstrap
npm install jquery
npm install laravel-mix

В /resources/js/bootstrap.js вверху добавьте или измените эти строки.Это загружает jQuery и Bootstrap в ваше приложение. 

window._ = require('lodash');

try {
    window.Popper = require('popper.js').default;
    window.$ = window.jQuery = require('jquery');

    require('bootstrap');
} catch (e) {}

В /resources/sass/app.scss:

@import 'variables';

// Bootstrap
@import '~bootstrap/scss/bootstrap';

Скомпилируйте ваши активы. 

npm run production

Теперь у вас есть два CSS-файла.Ссылка на оба в верхней части вашего шаблона Blade-файла.

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

В нижней части шаблона используйте app.js: 

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

Обратите внимание, что в вашем файле mix-manifest есть это содержимое. 

{
    "/js/app.js": "/js/app.js?id=0b5e26cf3116bf443cac",
    "/css/app.css": "/css/app.css?id=a99cdff2ed9d413fcb8a",
    "/css/all.css": "/css/all.css?id=a99cdff2ed9d413fcb8a"
}
...