Skip to content

Byte order marks included in output file #13642

@Bikeman868

Description

@Bikeman868

Bug report

When running on Windows and when the webpack mode=development byte order marks from the source files are copied to the output file. This results in broken Javascript.

This was reported a few years ago here #2868 and was never resolved.

If the current behavior is a bug, please provide the steps to reproduce.

  1. On a Windows 10 machine with node.js installed.
  2. Clone this repo https://github.com/Bikeman868/frag/tree/Webpack_issue_2021_06_26
  3. From a command prompt in the root directory of the repo type npm install
  4. In the command prompt window type npx webpack
  5. Look at the generated dist/frag.js file and see that it contains weird characters at the start of each module.

This is a very simple solution with the following Webpack config:

const path = require('path');

module.exports = {
  mode: 'development',
  entry: './src/index.js',
  output: {
    filename: 'frag.js',
    path: path.resolve(__dirname, 'dist')
  },
  devtool: 'source-map',
  watchOptions: {
    ignored: '**/node_modules'
  }
};

What is the expected behavior?

Byte-order-marks in Windows files are there to indicate whether the file is little-endian or big-endian. These are written into files automatically by most Windows software, and ignored when the file is opened in any application.

Webpack is copying the byte-order-mark bytes from source files into the output file resulting in broken Javascript.
It seems to do this only when the webpack mode is 'development'. I have not seen this when the mode is 'production'.

Other relevant information:
webpack version: 5.38.1
Node.js version: 15.14.0
Operating System: Windows 10
Additional tools: Windows Terminal + WSL + Ubuntu

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions