Giter Site home page Giter Site logo

Comments (11)

Amaimersion avatar Amaimersion commented on June 8, 2024

Hello!

Please provide a plugin config.

from remove-files-webpack-plugin.

YannPl avatar YannPl commented on June 8, 2024

Hi, there is my config.
I have commented the 3 folders I'd like to delete only once when I execute webopack in watch mode

new RemovePlugin({
        before: {
          root   : './public',
          include: [
            // 'css', // TODO : prevent these folders to be deleted in watch mode
            // 'images', // TODO : prevent these folders to be deleted in watch mode
            // 'js', // TODO : prevent these folders to be deleted in watch mode
            'mix.app.js',
            'mix.app.js.map',
            'mix-manifest.json'
          ],
          trash  : false
        },
        after : {
          // parameters for "after compilation" stage.
          root   : './public',
          include: [
            'mix.app.js',
            'mix.app.js.map',
            'mix-manifest.json'
          ]
        }
      })
    ],

from remove-files-webpack-plugin.

Amaimersion avatar Amaimersion commented on June 8, 2024

If i'm get it right: you don't want to delete css, images and js folders in "watch" mode, because you only watchs for changes in mix.app.js, min.app.js.map and mix-manifest.json files.

I wonder many times about separate watch parameter (similar to before and after), because before can have conflicts with "watch" mode (for example: you want to delete some items before actual compilation, but at the same time you want to keep some of these items in "watch" mode).

Will the next configuration to meet your expectations?

new RemovePlugin({
  /**
   * This will delete `css`, `images`, `js`,
   * `mix.app.js`, `mix.app.js.map` and `mix-manifest.json`
   * when you run `webpack`. 
   * Removing will occur only once.
   * Not worked in "watch" mode.
   */
  before: {
    root: './public',
    include: [
      'css',
      'images',
      'js',
      'mix.app.js',
      'mix.app.js.map',
      'mix-manifest.json'
    ],
    trash: false
  },

  /**
   * This will delete `mix.app.js`, `mix.app.js.map` and 
   * `mix-manifest.json` when you run `webpack` or `webpack --watch`.
   * Removing will occur every time after compilation and recompilation.
   */
  after: {
    root: './public',
    include: [
      /* you really need to delete this in both stages: before and after?
      'mix.app.js',
      'mix.app.js.map',
      'mix-manifest.json'
      */
    ]
  },

  /**
   * This will delete `mix.app.js`, `mix.app.js.map` and 
   * `mix-manifest.json` when you run `webpack --watch`
   * (i.e. `css`, `images` and `js` folders will be keeped).
   * Removing will occur every time before recompilation
   * (and first time when you run `webpack --watch`).
   * Works only in "watch" mode.
   */
  watch: {
    root: './public',
    include: [
      'mix.app.js',
      'mix.app.js.map',
      'mix-manifest.json'
    ]
  }
})

Note: watch not implemented yet. So, don't try to use this configuration. Just imagine your webpack lifecycle.

from remove-files-webpack-plugin.

Amaimersion avatar Amaimersion commented on June 8, 2024

I have updated code example from my reply.

from remove-files-webpack-plugin.

YannPl avatar YannPl commented on June 8, 2024

If i'm get it right: you don't want to delete css, images and js folders in "watch" mode, because you only watchs for changes in mix.app.js, min.app.js.map and mix-manifest.json files.

Those are files generated by mix, the tool I use to ease webpack configuration so I just want to delete them for a clean /public directory.

(for example: you want to delete some items before actual compilation, but at the same time you want to keep some of these items in "watch" mode).

This is exactly the problem I have:

  • I generate several JS files in the /js dir
  • When I modify my code, the watch only build 1 file
  • It triggers the delete for all js files and only 1 is recreated

Will the next configuration to meet your expectations?

It would be perfect to be able to delete different files at each watch rebuild like you show yes.

But is it possible to have the "full clean" executed at the start of the watch command but only the "watch" clean executed at rebuilds ?

(I don't know if I'm clear enough feel free to ask for clarification)

/* you really need to delete this in both stages: before and after?
'mix.app.js',
'mix.app.js.map',
'mix-manifest.json'
*/

You are right, I might delete this in the "after" step if I can declare a separate watch option

from remove-files-webpack-plugin.

Amaimersion avatar Amaimersion commented on June 8, 2024

It triggers the delete for all js files and only 1 is recreated
When I modify my code, the watch only build 1 file

I think it will be solved if i will add watch key. Please take a look at this:

new RemovePlugin({
  // will remove entire `public/js` folder 
  // in normal compilation (`webpack`).
  before: {
    root: './public',
    include: [
      './js'
    ]
  },
  
  // every time will remove entire `public/js/watch-file.js` 
  // file in watch compilation (`webpack --watch`).
  watch: {
    root: './public',
    include: [
      './js/watch-file.js'
    ]
  }
})

But is it possible to have the "full clean" executed at the start of the watch command but only the "watch" clean executed at rebuilds ?

You want to delete all items at initial "watch" step and only some items at future "watch" steps? I'm got it right?

You can use configuration like this when i implement watch key:

// ...

let watchStepsCount = 0;

module.exports = {
  // ...
  plugins: [
    new RemovePlugin({
      watch: {
        test: [
          {
            folder: './public',
            method: (absPath) => {
              if (watchStepsCount === 0) {
                // remove everything.
                return true;
              } else {
                const filesToDelete = [
                  'mix.app.js',
                  'mix.app.js.map',
                  'mix-manifest.json'
                ];

                for (const file of filesToDelete) {
                  const includes = absPath.includes(file);

                  if (includes) {
                    return true;
                  }
                }

                return false;
              }
            },
            recursive: true
          }
        ],
        afterRemove: () => watchStepsCount++
      }
    })
  ]
}

Just tested it at my local build. Works as expected (as i described above).

Actually, you can implement this for current version (1.3.0), but for before key, not watch. Because at the moment (1.3.0) before also works for "watch" mode, not just for normal compilation.

You are right, I might delete this in the "after" step if I can declare a separate watch option

These files will be removed twice at one compilation lifecycle. i.e., once before "watch" and right after the output from "watch".

from remove-files-webpack-plugin.

YannPl avatar YannPl commented on June 8, 2024

Thanks for your time and help, I will implement it in my project, and update if you release the "watch" option later !

from remove-files-webpack-plugin.

Amaimersion avatar Amaimersion commented on June 8, 2024

You can try to implement this at the moment for before key. By the way, release with watch key will be released soon (probably today).

from remove-files-webpack-plugin.

YannPl avatar YannPl commented on June 8, 2024

Nice ! Thanks !

from remove-files-webpack-plugin.

Amaimersion avatar Amaimersion commented on June 8, 2024

Please upgrade to 1.4.0 and use watch key.

from remove-files-webpack-plugin.

Amaimersion avatar Amaimersion commented on June 8, 2024

I'm closing this. If you still have troubles with that issue, then feel free to reopen.

from remove-files-webpack-plugin.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.