# Window is not defined in node.js, sigma.js and typescript environment

## All we need is an easy explanation of the problem, so here it is.

I try to setup a sigma.js project with node.js written in TypeScript. The following reference error occurs after starting the node.js server with:

ts-node index.ts


The error seems to occur directly within the sigma\utils\index.js.

<nodejsproject>\node_modules\sigma\utils\index.js:125
if (typeof window.devicePixelRatio !== "undefined")
^
ReferenceError: window is not defined
at getPixelRatio (<nodejsproject>\node_modules\sigma\utils\index.js:125:5)
at Object.<anonymous> (<nodejsproject>\node_modules\sigma\sigma.js:52:45)
at require (node:internal/modules/cjs/helpers:102:18)
at Object.<anonymous> (<nodejsproject>\node_modules\sigma\index.js:14:31)


I tried to setup the typescript configuration as follows:

package.json

{
...
"main": "index.ts",
"scripts": {
"dev": "nodemon ./index.ts",
"test": "echo \"Error: no test specified\" && exit 1",
"start": "ts-node index.ts"
},
"dependencies": {
"@types/sigmajs": "^1.0.28",
"express": "^4.17.2",
"fs": "^0.0.1-security",
"graphology": "^0.23.2",
"graphology-components": "^1.5.2",
"graphology-layout": "^0.5.0",
"graphology-layout-forceatlas2": "^0.8.1",
"papaparse": "^5.3.1",
"path": "^0.12.7",
"sigma": "^2.1.3",
"xhr": "^2.6.0"
},
"devDependencies": {
"@types/express": "^4.17.13",
"tslint": "^6.1.3",
"typescript": "^4.5.5"
}
}


tsconfig.json

{
"compilerOptions": {
"module": "commonjs",
"esModuleInterop": true,
"target": "es6",
"moduleResolution": "node",
"sourceMap": true,
"outDir": "dist",
"lib": ["dom"]
},
"lib": [
"es2015"
],
"exclude":[
"./node_modules"
]
}


The error is raised after instantiation of Sigma to draw the graph:

router.get('/', (request, response) => {

response.sendFile(path.join(__dirname+'/views/index.html'));

Papa.parse<{ original_table: string; referenced_table: string }>(file, {
delimiter: ';',
complete: (results) => {
const graph: Graph = new Graph();

//Build the node with their entities as nodes
results.data.forEach((line) => {

/* process loaded data to create the graph */

//Draw the graph within the browser
const container = document.getElementById("network-container") as HTMLElement;

new Sigma(graph, container); //error occurs right here
},
});
});


## How to solve :

I know you bored from this bug, So we are here to help you! Take a deep breath and look at the explanation of your problem. We have many solutions to this problem, But we recommend you to use the first method because it is tested & true method that will 100% work for you.

### Method 1

Well, no, it isn’t.

Express.js is a server-side framework for generating responses to HTTP requests. It runs on Node.js. It doesn’t have a window.

Sigma is a graphing library designed to be run by a web browser when it is embedded in a webpage (via a <script> element). It works by manipulating the DOM of that webpage.

It isn’t compatible with Node.js or Express.js.

The existence of a package on NPM shouldn’t be taken to mean that a module is compatible with Node.js. Many modules there are designed to be used in web browsers by applications which use NPM to manage their dependencies. (These are typically applications written using a SPA framework like React, Angular or Vue which bundle the modules they depend on using tools like Webpack or Parcel).

Note: Use and implement method 1 because this method fully tested our system.
Thank you 🙂