Laravel-Mix-Purgecss и Summernote - PullRequest
Новая
       7

Laravel-Mix-Purgecss и Summernote

0 голосов
/ 16 сентября 2018

Я недавно добавил laravel-mix-purgecss в свой проект laravel.Всё прошло замечательно, пока я не заметил, что он снял все CSS из Summernote.Как я могу исключить CSS из чистки или включить все классы, чтобы Summernote работала?

Обратите внимание, что Summernote работал нормально, пока я не использовал Purgecss.Также Summernote находится внутри компонента Vue.

Вот то, что я пробовал до сих пор ..

webpack.mix.js 

let mix = require('laravel-mix');
const glob = require('glob-all');

require('laravel-mix-purgecss');

mix.js('resources/assets/js/app.js', 'public/js')
    .js('resources/assets/js/app-admin.js', 'public/js')
   .sass('resources/assets/sass/app.scss', 'public/css')
   .sass('resources/assets/sass/app-admin.scss', 'public/css')
   .purgeCss({
        enabled: true,

        // This code didnt help and throws a error when I 'npm run dev'
        // globs: () => [
        //     path.join(__dirname, 'node_modules/summernote/**/*.js'),
        // ],

        // This code was not required. Works without it
        // paths: () => glob.sync([
        //     path.join(__dirname, 'resources/views/**/*.blade.php'),
        //     path.join(__dirname, 'resources/assets/js/**/*.vue')
        // ]),

        extensions: ['html', 'js', 'php', 'vue']
    });

Summernote включен в .vueкомпонент 

<script>
    import 'summernote'
    export default {
        components: {
            'summernote' : require('./../Summernote')
        },
        .....
    }
</script>

1 Ответ

0 голосов
/ 19 сентября 2018

Хорошо, так что я понял это, но это не через веб-пакет или микс Laravel. Просто вы копируете весь выведенный HTML-код summernote и вставляете его в новый блейд-файл (или в любой файл, который вы указываете PurgeCss для поиска), который вы просто никогда не используете. PurgeCss проверит все ваши файлы блейдов и найдет все классы.

Итак, я сделал главный включающий файл, который будет содержать все классы, которых еще нет во всех файлах Vue или blade.php. Нет необходимости включать этот файл в Laravel.

Это будет работать с любым классом, который PurgeCss не может найти в ваших файлах. Просто сделайте div со всеми классами и через этот файл, где находятся остальные ваши файлы представления. 

<div class="any-misses-classes-here"></div>

Это означает, что код в моем оригинальном посте выше будет работать. Просто удалите все, что закомментировано.

Это решение кажется глупым, но простым. Надеюсь, что это поможет любому с той же проблемой!

...