How to tell Webpack to output nothing?

249 Views Asked by At

I'm trying to configure svg-sprite-loader/plugin. I've made standalone Webpack configuration file for that task. It look into specified directory and take every .svg from it. The result is icons.svg sprite file. BUT Webpack also creates .js for every entry file. Is that possible to exlude or... delete... or whatever... those files? In other words I need only plugin output, nothing else.

Thank you in advance!

P.S. Maybe I just should programmatically delete those files after task completed?

webpack.prod.conf.js

const merge = require('webpack-merge');

const webpackBaseConfig = require('./webpack.base.conf');
const webpackSpritesConfig = require('./webpack.sprites.conf');

module.exports = [
  webpackSpritesConfig,
  merge(webpackBaseConfig, {
    ...
  })
];

webpack.sprites.conf.js

const fs = require('fs');
const path = require('path');
const SpriteLoaderPlugin = require('svg-sprite-loader/plugin');

function getSprites() {
  let sprites = {};

  fs.readdirSync(path.resolve(__dirname, '../src/sprites'))
    .filter(file => file.match(/\.svg/))
    .forEach(file => {
      let filename = file.split('.');

      filename.pop();

      sprites[filename] = path.resolve(__dirname, '../src/sprites/' + file);
    });

  return sprites;
}

module.exports = {
  entry: getSprites(),
  module: {
    rules: [
      {
        test: /\.svg$/,
        loader: 'svg-sprite-loader',
        options: {
          extract: true,
          spriteFilename: 'img/icons.svg'
        }
      }
    ]
  },
  plugins: [new SpriteLoaderPlugin()]
};
1

There are 1 best solutions below

0
On

My workaround is to delete those generated files after Webpack done hook:

webpack.sprites.conf.js

const fs = require('fs');
const path = require('path');
const SpriteLoaderPlugin = require('svg-sprite-loader/plugin');

const EventHooksPlugin = require('event-hooks-webpack-plugin');
const { CallbackTask } = require('event-hooks-webpack-plugin/lib/tasks');

let files = [];

function getSprites() {
  let sprites = {};

  fs.readdirSync(path.resolve(__dirname, '../src/sprites'))
    .filter(file => file.match(/\.svg/))
    .forEach(file => {
      let filename = file.split('.');

      filename.pop();

      files.push(path.resolve(__dirname, '../dist/' + filename + '.js'));
      sprites[filename] = path.resolve(__dirname, '../src/sprites/' + file);
    });

  return sprites;
}

module.exports = {
  entry: getSprites(),
  module: {
    rules: [
      {
        test: /\.svg$/,
        loader: 'svg-sprite-loader',
        options: {
          extract: true,
          spriteFilename: 'img/icons.svg'
        }
      }
    ]
  },
  plugins: [
    new SpriteLoaderPlugin(),
    new EventHooksPlugin({
      done: new CallbackTask((compiler, callback) => {
        files.forEach(file => {
          fs.unlinkSync(file);
        });

        callback();
      })
    })
  ]
};