@import в js файлах

Question

В scss у меня есть главный файл common.scss в который я добавляю новые файлы с помошью команды @import Потом все это дело обарабатывается с помощью gulp

common.scss

@import './my-file';

my-file.scss

.container {
    color: red;
}

Как такое же реализовать для js файлов?

может подскажете плагины для галпа, или еще какие идеи

UPD: вебпак не рассматриваю, слишком много лишнего кода добавляет, но если использовать вебпак ВМЕСТО галпа - значит надо как то научить вебпак делать все то что делает мне галп, суть в том чтобы был один инструмент вместо двух

Answer 1

Напишите в gulp такого рода таск, в котором у Вас будет через плагин webpack-stream(https://www.npmjs.com/package/webpack-stream) запускаться webpack, который будет обрабатывать модули.

module.exports = function script() {
          return gulp
            .src(path.js.src)
            .pipe(
              webpack({
                mode: process.env.NODE_ENV,
                output: {
                  filename: "[name].min.js",
                },
                module: {
                  rules: [
                    {
                      test: /\.m?js$/,
                      exclude: /(node_modules)/,
                      use: {
                        loader: "babel-loader",
                        options: {
                          presets: ["@babel/preset-env"],
                        },
                      },
                    },
                  ],
                },
                plugins: [],
              })
            )
            .pipe(gulp.dest(path.js.build));
        };

БЛОГ НА HUSL

@import в js файлах

Ответы (1 шт):