index.html written in same folder like bundle.js

[raphet]

    output: {
        format: 'iife',
        name: 'app',
        file: 'public/build/bundle.js'
    },
    plugins: [
        html2({
            template: 'src/template.html',
            fileName: 'index.html',
            externals: [{ file: 'build/bundle.css', pos:  'before' }]
        }),

Structure - wanted: /src/template.html /public/index.html /public/build/bundle.js /public/build/bundle.css

Structure - given: /src/template.html /public/build/index.html /public/build/bundle.js /public/build/bundle.css

In other words, this script stores index.html in the same folder as the bundle.js but I would like to store it one folder up. How would I set this?

[ierhyna]

Hi, any updates on this issue?

[mentaljam]

Hi, sorry but I cannot maintain this repo any more...

[mentaljam]

You can try to achieve the desired placement of files by setting output.entryFileNames and output.chunkFileNames:

const fileNames = 'build/[name].js'

export default {
  output: {
    entryFileNames: fileNames,
    chunkFileNames: fileNames,
    // Other options
  }
  // Other options
}

However, all the assets (for example generated CSS files) will be placed near your generated html file. To place these files to the build subdir you can define the output.assetFileNames as function:

const fileNames = 'build/[name].js'

export default {
  output: {
    entryFileNames: fileNames,
    chunkFileNames: fileNames,
    assetFileNames({fileName}) {
      return fileName !== 'index.html' ? ('build/' + fileName) : fileName
    }
    // Other options
  }
  // Other options
}