Node.js - Revision history

Denperidge: Added development environment

2026-05-27T18:26:36Z

Added development environment

← Older revision		Revision as of 18:26, 27 May 2026
Line 9:		Line 9:

	See <code>nix search nixpkgs nodejs</code> for additional versions like <code>nodejs-12_x</code>, etc.		See <code>nix search nixpkgs nodejs</code> for additional versions like <code>nodejs-12_x</code>, etc.

			== Development environment ==
			Also see [[Development environment with nix-shell]] on this wiki.

			=== Nixpkgs example ===
			<syntaxhighlight lang="nix">
			# shell.nix
			{ pkgs ? import <nixpkgs> {} }:
			pkgs.mkShell {
			nativeBuildInputs = with pkgs.buildPackages; [
			nodejs_22
			yarn
			];
			}
			</syntaxhighlight>

			=== Corepack example ===
			To use specific/pinned versions of your runtime & package manager, a combination of corepack & steam-run can be used<syntaxhighlight lang="nix">
			# shell.nix
			{ pkgs ? import <nixpkgs> {} }:

			pkgs.mkShell {
			buildInputs = with pkgs; [
			corepack
			steam-run-free
			];
			shellHook = ''
			alias deno="steam-run pnpm deno"
			'';
			}

			</syntaxhighlight><syntaxhighlight lang="json">
			// package.json
			{
			"packageManager": "pnpm@11.4.0",
			"devEngines": {
			"runtime": {
			"name": "deno",
			"version": "^2.7.14",
			"onFail": "download"
			}
			}
			}

			</syntaxhighlight>

	== Packaging ==		== Packaging ==

DHCP: various formatting and style improvements

2026-05-20T21:10:07Z

various formatting and style improvements

← Older revision		Revision as of 21:10, 20 May 2026
Line 72:		Line 72:
	<syntaxhighlight lang="console">		<syntaxhighlight lang="console">
	$ nix-shell -p yarn yarn2nix		$ nix-shell -p yarn yarn2nix
	$ yarn install		$ yarn install # creates yarn.lock
	# creates yarn.lock
	$ yarn2nix > yarn.nix		$ yarn2nix > yarn.nix
	$ vim package.json		$ vim package.json # add: "bin": "app.js",
	# add: "bin": "app.js",
	$ cat > default.nix <<EOF		$ cat > default.nix <<EOF
	with (import <nixpkgs> {});		with (import <nixpkgs> {});
Line 125:		Line 123:
	This is done through configuring npm and amending your <tt>PATH</tt>.<ref>[https://logs.nix.samueldr.com/nixos/2018-07-09#1358500 joepie91 on #nixos, 2018-07-09]</ref>		This is done through configuring npm and amending your <tt>PATH</tt>.<ref>[https://logs.nix.samueldr.com/nixos/2018-07-09#1358500 joepie91 on #nixos, 2018-07-09]</ref>

	<~~pre~~>		<syntaxhighlight lang="console">
	$ npm set prefix ~/.npm-global		$ npm set prefix ~/.npm-global
	</~~pre~~>		</syntaxhighlight>

	Then, amend your <tt>PATH</tt> so it looks into <tt>$HOME/.npm-global</tt>.		Then, amend your <tt>PATH</tt> so it looks into <tt>$HOME/.npm-global</tt>.
Line 135:		Line 133:
	This is a bit harder to implement, but creates a bit more strictness in your environment; it will be impossible accidentally make use of what would have been a globally installed package. The idea is to install it to either a temporary transitory folder or to the project folder, then run the locally installed instance of the package, the binaries are found under <tt>node_packages/.bin/</tt>.<ref>[https://logs.nix.samueldr.com/nixos/2018-07-17#1386090; samueldr on #nixos, 2018-07-17]</ref>		This is a bit harder to implement, but creates a bit more strictness in your environment; it will be impossible accidentally make use of what would have been a globally installed package. The idea is to install it to either a temporary transitory folder or to the project folder, then run the locally installed instance of the package, the binaries are found under <tt>node_packages/.bin/</tt>.<ref>[https://logs.nix.samueldr.com/nixos/2018-07-17#1386090; samueldr on #nixos, 2018-07-17]</ref>

	<~~pre~~>		<syntaxhighlight lang="console">
	$ npm install uglify-es		$ npm install uglify-es
	[ ... ]		[ ... ]

	$ ls -l node_modules/.bin/		$ ls -l node_modules/.bin/
	total 0		total 0
	lrwxrwxrwx 1 user users 25 Jul 17 15:34 uglifyjs -> ../uglify-es/bin/uglifyjs		lrwxrwxrwx 1 user users 25 Jul 17 15:34 uglifyjs -> ../uglify-es/bin/uglifyjs

	$ node_modules/.bin/uglifyjs --help		$ node_modules/.bin/uglifyjs --help
	Usage: uglifyjs [options] [files...]		Usage: uglifyjs [options] [files...]
	</~~pre~~>		</syntaxhighlight>

	===== direnv =====		===== direnv =====
Line 159:		Line 157:
	==== Using <code>npx</code> ====		==== Using <code>npx</code> ====

	<~~pre~~>		<syntaxhighlight lang="console">
	$ nix-shell -p nodejs-8_x		$ nix-shell -p nodejs-8_x

	$ npx create-react-app --help		$ npx create-react-app --help
	npx: installed 67 in 1.671s		npx: installed 67 in 1.671s
	Usage: create-react-app <project-directory> [options]		Usage: create-react-app <project-directory> [options]
	[...]		[...]
	</~~pre~~>		</syntaxhighlight>

	==== Using <code>npx</code> with binaries ====		==== Using <code>npx</code> with binaries ====
Line 175:		Line 173:
	For example, <code>npx cypress open</code> might give an error like:		For example, <code>npx cypress open</code> might give an error like:

	<~~pre~~>		<syntaxhighlight lang="console">
	$ npx cypress open		$ npx cypress open

Line 185:		Line 183:
	----------		----------
	spawn /home/rkb/.cache/Cypress/4.10.0/Cypress/Cypress ENOENT		spawn /home/rkb/.cache/Cypress/4.10.0/Cypress/Cypress ENOENT
	</~~pre~~>		</syntaxhighlight>

	One quick workaround for this is [[Steam#FHS environment only\| to use <code>steam-run</code>]] to provide a placeholder FHS environment that should work; e.g. for the Cypress example above:		One quick workaround for this is [[Steam#FHS environment only\| to use <code>steam-run</code>]] to provide a placeholder FHS environment that should work; e.g. for the Cypress example above:

	<~~pre~~>		<syntaxhighlight lang="console">
	$ nix-env -iA nixos.steam-run		$ nix-env -iA nixos.steam-run

Line 195:		Line 193:

	-- Cypress opens successfully!		-- Cypress opens successfully!
	</~~pre~~>		</syntaxhighlight>

	(Inspired by [https://discourse.nixos.org/t/how-to-make-nixos-so-easy-that-people-can-be-productive-up-front-without-having-to-first-learn-the-nix-language/5625 this discussion on discourse.nixos.org])		(Inspired by [https://discourse.nixos.org/t/how-to-make-nixos-so-easy-that-people-can-be-productive-up-front-without-having-to-first-learn-the-nix-language/5625 this discussion on discourse.nixos.org])
Line 201:		Line 199:
	'''Google-fonts fetch failure with NextJS'''		'''Google-fonts fetch failure with NextJS'''

	Nextjs is a popular React framework and comes with built-in support with support for Google fonts. If a NPM project uses it, <syntaxhighlight lang="~~shell~~">		Nextjs is a popular React framework and comes with built-in support with support for Google fonts. If a NPM project uses it, <syntaxhighlight lang="console">
	npm run build # which calls "next build"		$ npm run build # which calls "next build"
	</syntaxhighlight>will try to fetch and optimize the Google fonts during a nix build run, which will fail in Nix's isolated sandbox without internet:<syntaxhighlight lang="shell">		</syntaxhighlight>will try to fetch and optimize the Google fonts during a nix build run, which will fail in Nix's isolated sandbox without internet:<syntaxhighlight lang="shell">
	...		...
Line 236:		Line 234:
	ERROR: `npm build` failed		ERROR: `npm build` failed
	</syntaxhighlight>You have to patch the Javascript code <syntaxhighlight lang="javascript">		</syntaxhighlight>You have to patch the Javascript code <syntaxhighlight lang="javascript">
	# In layout.tsx file replace		// In layout.tsx file replace
	#		//
	# import {Inter} from "next/font/google"; #or any other Google font like Inter		// import {Inter} from "next/font/google"; // or any other Google font like Inter
	# const inter = Inter({ subsets: ["latin"] });		// const inter = Inter({ subsets: ["latin"] });
	#		//
	# with ("src:" must be relative to the src/app/layout.tsx file):		// with ("src:" must be relative to the src/app/layout.tsx file):
	import localFont from "next/font/local";		import localFont from "next/font/local";
	const inter = localFont({ src: './Inter.ttf' });		const inter = localFont({ src: './Inter.ttf' });
Line 259:		Line 257:
	...		...
	}		}
	</syntaxhighlight>You can take a look at what fonts are available in the Nix <code>google-fonts</code> package by calling:<syntaxhighlight lang="~~shell~~">		</syntaxhighlight>You can take a look at what fonts are available in the Nix <code>google-fonts</code> package by calling:<syntaxhighlight lang="console">
	ls -ahl $(nix build --no-link --print-out-paths nixpkgs#google-fonts)/share/fonts/truetype/		$ ls -ahl $(nix build --no-link --print-out-paths nixpkgs#google-fonts)/share/fonts/truetype/
	</syntaxhighlight>Take a look at [https://github.com/NixOS/nixpkgs/blob/8358fd43a66594d8b3445d87006185fa76d4be6e/pkgs/by-name/ho/homepage-dashboard/package.nix homepage-dashboard package in nixpkgs] for further workarounds for Nextjs in Nix.		</syntaxhighlight>Take a look at [https://github.com/NixOS/nixpkgs/blob/8358fd43a66594d8b3445d87006185fa76d4be6e/pkgs/by-name/ho/homepage-dashboard/package.nix homepage-dashboard package in nixpkgs] for further workarounds for Nextjs in Nix.

Line 312:		Line 310:
	<syntaxhighlight lang="nix>		<syntaxhighlight lang="nix>
	final: prev: {		final: prev: {
	nodejs = prev.nodejs-16_x;		nodejs = prev.nodejs-16_x;
	}		}
	</syntaxhighlight>		</syntaxhighlight>
	<~~pre~~>		<syntaxhighlight lang="console">
	$ pnpm node --version		$ pnpm node --version
	v16.17.1		v16.17.1
	</~~pre~~>		</syntaxhighlight>

	=== Override NodeJS package ===		=== Override NodeJS package ===

Makefu: update link to homepage-dashboard package

2025-11-27T20:34:52Z

update link to homepage-dashboard package

← Older revision		Revision as of 20:34, 27 November 2025
Line 261:		Line 261:
	</syntaxhighlight>You can take a look at what fonts are available in the Nix <code>google-fonts</code> package by calling:<syntaxhighlight lang="shell">		</syntaxhighlight>You can take a look at what fonts are available in the Nix <code>google-fonts</code> package by calling:<syntaxhighlight lang="shell">
	ls -ahl $(nix build --no-link --print-out-paths nixpkgs#google-fonts)/share/fonts/truetype/		ls -ahl $(nix build --no-link --print-out-paths nixpkgs#google-fonts)/share/fonts/truetype/
	</syntaxhighlight>Take a look at https://github.com/NixOS/nixpkgs/blob/~~master~~/pkgs/~~servers~~/homepage-dashboard/~~default~~.nix for further workarounds for Nextjs in Nix.		</syntaxhighlight>Take a look at [https://github.com/NixOS/nixpkgs/blob/8358fd43a66594d8b3445d87006185fa76d4be6e/pkgs/by-name/ho/homepage-dashboard/package.nix homepage-dashboard package in nixpkgs] for further workarounds for Nextjs in Nix.

	== Tips and tricks ==		== Tips and tricks ==

Turbotimon: /* Example nix flake shell for Node.js development */ is displayed wrong. Couldn't fix it but added this note

2025-09-08T07:57:08Z

Example nix flake shell for Node.js development: is displayed wrong. Couldn't fix it but added this note

← Older revision		Revision as of 07:57, 8 September 2025
Line 265:		Line 265:
	== Tips and tricks ==		== Tips and tricks ==
	=== Example nix flake shell for Node.js development ===		=== Example nix flake shell for Node.js development ===
	[[Flake]] example:		[[Flake]] example: (Note: the `${&lt;nixpkgs&gt;}` needs to be replaced by `${<nixpkgs>}`
	{{file\|flake.nix\|nix\|		{{file\|flake.nix\|nix\|
	<nowiki>		<nowiki>

Arcstur: /* Packaging */ example on how to package a npm package with flakes

2025-08-28T16:56:13Z

Packaging: example on how to package a npm package with flakes

@@ Line 13: / Line 13: @@
 === Packaging with <code>buildNpmPackage</code> ===
 From the [https://nixos.org/manual/nixpkgs/stable/#javascript-tool-specific Nixpkgs manual]: "<code>buildNpmPackage</code> allows you to package npm-based projects in Nixpkgs without the use of an auto-generated dependencies file (as used in node2nix). It works by utilizing npm’s cache functionality – creating a reproducible cache that contains the dependencies of a project, and pointing npm to it."
-'''To better understand what happens under the hood and see the latest features see'''
+To better understand what happens under the hood and see the latest features [https://github.com/NixOS/nixpkgs/blob/master/pkgs/build-support/node/build-npm-package/default.nix see the build-npm-package source].
-https://github.com/NixOS/nixpkgs/blob/master/pkgs/build-support/node/build-npm-package/default.nix
+<syntaxhighlight lang="json">
 ==== Packaging electron applications ====

Pigs: Link to other pages

2025-05-23T16:12:55Z

Link to other pages

← Older revision		Revision as of 16:12, 23 May 2025
Line 1:		Line 1:
	__TOC__		__TOC__

	[https://nodejs.org Node.js] is an open-source, cross-platform JavaScript runtime environment that allows developers to execute JavaScript code on the server side. Built on the V8 JavaScript engine, it enables the creation of scalable and high-performance applications, particularly for real-time web services.		[https://nodejs.org Node.js] is an open-source, cross-platform [[JavaScript]] runtime environment that allows developers to execute JavaScript code on the server side. Built on the V8 JavaScript engine, it enables the creation of scalable and high-performance applications, particularly for real-time web services.

	== Setup ==		== Setup ==
Line 222:		Line 222:
	== Tips and tricks ==		== Tips and tricks ==
	=== Example nix flake shell for Node.js development ===		=== Example nix flake shell for Node.js development ===
	`flake.nix~~` example:~~		[[Flake]] example:
	<~~syntaxhighlight lang="nix~~>		{{file\|flake.nix\|nix\|
			<nowiki>
	{		{
	description = "example-node-js-flake";		description = "example-node-js-flake";
Line 261:		Line 262:
	}		}

	</~~syntaxhighlight~~>		</nowiki>
			}}

	=== Using nodePackages with a different node version ===		=== Using nodePackages with a different node version ===

Klinger: Category:JavaScript

2025-03-25T09:19:31Z

Category:JavaScript

← Older revision		Revision as of 09:19, 25 March 2025
Line 311:		Line 311:

	=== References ===		=== References ===


			[[Category:JavaScript]]

Kyaru: Move packaging contents to "Packaging" section

2024-11-24T07:42:50Z

Move packaging contents to "Packaging" section

@@ Line 9: / Line 9: @@
 See <code>nix search nixpkgs nodejs</code> for additional versions like <code>nodejs-12_x</code>, etc.
 == Troubleshooting ==
@@ Line 176: / Line 221: @@
 == Tips and tricks ==
 === Example nix flake shell for Node.js development ===
 `flake.nix` example:

Onny: Add override nodejs app example

2024-09-05T06:49:12Z

Add override nodejs app example

@@ Line 272: / Line 272: @@
 v16.17.1
 </pre>
 == External Links ==

Onny: Cleanup page

2024-09-05T06:43:18Z

Cleanup page

Show changes