TypeError: SerialPort is not a constructor

[kevinlinxc]

I am getting the TypeError: SerialPort is not a constructor error when I npm start my React CRA project. This issue has appeared before, but I believe my code to be up to date and yet I still get this error.

Here is the code:

var portName = 'COM5'; 
var buffer = "";
var baud = 9600;
var SerialPort = require('serialport');
var serialPort = new SerialPort(portName, {baudRate:baud});

The documentation says:

const port = new SerialPort('/dev/tty-usbserial1', {
  baudRate: 57600
})

should open the port. I have tried to forgo the semicolons, but I still get the "not a constructor" error.

Info:

I am using this in a .js file in a react project. My serialport version is 9.2.0

[GazHank]

Hi @kevinlinxc

I'm not familiar with React CRA but after a little scanning a couple of things jump out. The error you mentioned appears to occur when the module is invoked in the App.js rather than the Index.js. While switching the logic into the index.js still generates errors they are more consistent with the error reported by users of react trying to get native node modules to work...

@romecatholic since you experienced issues with the React CRA and managed to solve them are you able to help suggest any fixes or support material in addition to https://github.com/uidotdev/react-router-v5-server-rendering ?

[kevinlinxc]

I tried out putting it in index.js as you said, and I get this: I know we weren't expecting this to resolve it, just wanted to add to the conversation. Until I find a better solution, I'm using a python script to read Serial and send to the websocket client that is my website.

[GazHank]

Hi @kevinlinxc are you able to describe your usecase in a little more details? I wonder if you might be better placed to use something else rather than CRA but can't be certain based on your usage.

In particular, CRA as far as I can tell, seems to try to hide a lot common settings within the dependencies on react-scripts. While this makes the initial startup easy, those scripts actually disable certain functionality such as library for file systems access for security reasons. In our case we use the file system library for the serial communications. Additionally I believe it enforces strong typing, so you would need to look into https://github.com/DefinitelyTyped/DefinitelyTyped and https://www.npmjs.com/package/@types/serialport

I think you might find it easier to use another tool, or creating-a-react-app-from-scratch since you may find that you need to spend more time disabling or revising the config that CRA has given you out of the box

[kevinlinxc]

Hi @GazHank,

Unfortunately, this CRA project is legacy, with lots of features already implemented into it by teammates before I joined this team. Having this project in CRA is technical debt, I suppose, and it's okay if serialport doesn't work with it since I have the python implementation. If anyone comes forward with an easy fix that would be nice, but maybe unlikely. I appreciate the help anyway.

[suhyouri]

@kevinlinxc kevinlinxc Hi kevinlinxc. I faced same issue on my code. did you solve fix the problem?

[reconbot]

If you console log the return on the require statement, what do you see?

[suhyouri]

hi! thank you for comment this is what i got! @reconbot

[reconbot]

So it looks like you're using serialport v10 not v9

See the upgrade guide https://serialport.io/docs/guide-upgrade#upgrading-from-9x-to-10x

[kevinlinxc]

@suhyouri I never made node-serialport work, at the time (July) I instead made an asynchronous Python script that read and published to and from the serial bus. Since then I've removed CRA from our project so I never needed to use this library again.

[suhyouri]

@reconbot yay! i changed ES6 version ! and all worked! thank you so much! https://github.com/suhyouri/rpi4_clientside

[hellerim]

Although this issue should be closed by now, I'd like to mention that the correct import statement looks like const SerialPort = require('serialport').SerialPort with CommonJS and like import{SerialPort} when using modules.