Настройте чистый компонент HTML / CSS с помощью Webpack. - PullRequest
Новая
       6

Настройте чистый компонент HTML / CSS с помощью Webpack.

0 голосов
/ 08 ноября 2018

Я новичок в настройке webpack. Я знаю, что он часто используется для таких приложений, как React, Angular и т. Д .; но мне это не нужно. Меня попросили настроить проект, в котором мы будем создавать компоненты на чистом HTML / CSS (Sass) / JS, которые впоследствии будут объединены для шаблонов (исключительно для целей дизайна). В основном похоже на то, как React делает свои компоненты без самого React.

Как настроить проект, подобный структуре ниже, с webpack и плагинами, которые идут с ним?

Большое спасибо

Пример структуры: 

-rootfolder:
    -dist/
    -src/
        -components/
            -progress-bar:
                -progress-bar.html
                -progress-bar.scss
                -progress-bar.js
            -accordion/
                -accordion.html
                -accordion.scss
                -accordion.js
            -alert/
                -alert.html
                -alert.scss
                -alert.js
        -templates/
            -home.html
            -user-profile.html
            -user-dashboard.html

1 Ответ

0 голосов
/ 08 ноября 2018

Способ настройки проекта Webpack только для HTML / SASS / JS очень похож на настройку проекта React. Если вы настроите нулевой конфиг Google Webpack 4, вы найдете несколько очень хороших статей, в которых приведены пошаговые инструкции.

Вам понадобятся следующие плагины с Webpack 4: 1. html-webpack-плагин 2. mini-css-extract-plugin

...