Unexpected character '�' when building with webpack

[arthurdevv]

Environment details

• OS: Windows 10
• OS version: 10.0.19043
• node-pty version: 0.10.1

Issue description

When try to build it with webpack using babel-loader and node-loader fails:

Error logs

asset main.js 49.8 KiB [compared for emit] (name: main) 1 related asset
runtime modules 937 bytes 4 modules
built modules 905 KiB [built]
  cacheable modules 905 KiB
    modules by path ./node_modules/node-pty/lib/*.js 39.5 KiB 7 modules
    modules with errors 864 KiB [errors]
      ./node_modules/node-pty/build/Release/pty.node 411 KiB [built] [code generated] [1 error]
      ./node_modules/node-pty/build/Release/conpty.node 453 KiB [optional] [built] [code generated] [1 error]
    ./src/electron/main.ts 1.12 KiB [built] [code generated]
  external "electron" 42 bytes [built] [code generated]
  external "net" 42 bytes [built] [code generated]
  external "events" 42 bytes [built] [code generated]
  external "fs" 42 bytes [built] [code generated]
  external "os" 42 bytes [built] [code generated]
  external "path" 42 bytes [built] [code generated]
  external "child_process" 42 bytes [built] [code generated]

ERROR in ./node_modules/node-pty/build/Release/conpty.node 1:2
Module parse failed: Unexpected character '�' (1:2)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
(Source code omitted for this binary file)
 @ ./node_modules/node-pty/lib/windowsPtyAgent.js 36:35-74 40:39-78
 @ ./node_modules/node-pty/lib/windowsTerminal.js 22:24-52
 @ ./node_modules/node-pty/lib/index.js 10:19-63
 @ ./src/electron/main.ts 2:0-33 24:20-25

ERROR in ./node_modules/node-pty/build/Release/pty.node 1:2
Module parse failed: Unexpected character '�' (1:2)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
(Source code omitted for this binary file)
 @ ./node_modules/node-pty/lib/index.js 49:49-85
 @ ./src/electron/main.ts 2:0-33 24:20-25

[corwin-of-amber]

You definitely cannot load native modules in webpack. I suggest adding node-pty as an external module: https://webpack.js.org/configuration/externals/

This will allow running in Electron with Node integration turned on.

[arthurdevv]

When adding node-pty as an external module, the webpack compiled successfully, but fails:

App threw an error during load
ReferenceError: node is not defined
    at Object.node-pty (C:\Users\arthur\Desktop\Terminal\dist\main.js:21:18)
    at __webpack_require__ (C:\Users\arthur\Desktop\Terminal\dist\main.js:45:41)
    at C:\Users\arthur\Desktop\Terminal\dist\main.js:102:66
    at C:\Users\arthur\Desktop\Terminal\dist\main.js:153:3
    at Object.<anonymous> (C:\Users\arthur\Desktop\Terminal\dist\main.js:155:12)
    at Module._compile (internal/modules/cjs/loader.js:1078:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1108:10)
    at Module.load (internal/modules/cjs/loader.js:935:32)
    at Module._load (internal/modules/cjs/loader.js:776:14)
    at Function.f._load (electron/js2c/asar_bundle.js:5:12913)

[arthurdevv]

So I installed webpack-node-externals and added it to the webpack:

const nodeExternals = require('webpack-node-externals');
module.exports = {
  ...
  externals: [nodeExternals()],
  ...
};

it worked.

Edit: I think the problem was that node-pty was not as an external module, as @corwin-of-amber said. Thanks!

[corwin-of-amber]

Great. FYI this could also work:

module.exports = {
   ...
   externals: {
      'node-pty': 'commonjs2 node-pty'
   }
   ...
}

Via the string value option.

It is one of the less intuitive nooks of webpack, I have to admit.