feat(lint): use ESLint for linting snippets

Author: avivkeller

apps/site/eslint.config.js

@@ -40,6 +40,7 @@ export default tseslint.config(
   {
     files: ['**/*.{md,mdx}'],
     extends: [mdx.flat],
+    processor: mdx.createRemarkProcessor({ lintCodeBlocks: true }),
     rules: {
       'no-irregular-whitespace': 'off',
       '@next/next/no-img-element': 'off',
@@ -77,5 +78,6 @@ export default tseslint.config(
         },
       ],
     },
-  }
+  },
+  mdx.flatCodeBlocks
 );

apps/site/next.mdx.plugins.mjs

@@ -10,8 +10,6 @@ import rehypeShikiji from './next.mdx.shiki.mjs';
 
 /**
  * Provides all our Rehype Plugins that are used within MDX
- *
- * @type {Array<import('unified').Plugin>}
  */
 export const REHYPE_PLUGINS = [
   // Generates `id` attributes for headings (H1, ...)
@@ -25,8 +23,6 @@ export const REHYPE_PLUGINS = [
 
 /**
  * Provides all our Remark Plugins that are used within MDX
- *
- * @type {Array<import('unified').Plugin>}
  */
 export const REMARK_PLUGINS = [
   // Support GFM syntax to be used within Markdown

apps/site/package.json

@@ -6,12 +6,11 @@
     "check-types": "tsc --noEmit",
     "deploy": "cross-env NEXT_PUBLIC_STATIC_EXPORT=true NODE_NO_WARNINGS=1 next build",
     "dev": "cross-env NODE_NO_WARNINGS=1 next dev",
-    "lint": "turbo run lint:md lint:snippets lint:js lint:css",
+    "lint": "turbo run lint:md lint:js lint:css",
     "lint:css": "stylelint \"**/*.css\" --allow-empty-input --cache --cache-strategy=content --cache-location=.stylelintcache",
     "lint:fix": "turbo run lint:md lint:js lint:css --no-cache -- --fix",
     "lint:js": "eslint \"**/*.{js,mjs,ts,tsx}\"",
     "lint:md": "eslint \"**/*.md?(x)\" --cache --cache-strategy=content --cache-location=.eslintmdcache",
-    "lint:snippets": "node ./scripts/lint-snippets/index.mjs",
     "scripts:release-post": "cross-env NODE_NO_WARNINGS=1 node scripts/release-post/index.mjs",
     "serve": "pnpm dev",
     "start": "cross-env NODE_NO_WARNINGS=1 next start",
@@ -97,7 +96,6 @@
     "remark-lint-no-unused-definitions": "^4.0.2",
     "remark-lint-prohibited-strings": "^4.0.0",
     "remark-lint-unordered-list-marker-style": "^4.0.1",
-    "remark-parse": "11.0.0",
     "remark-preset-lint-node": "5.1.2",
     "stylelint": "16.19.1",
     "stylelint-config-standard": "38.0.0",
@@ -106,7 +104,6 @@
     "tsx": "^4.19.3",
     "typescript": "~5.8.2",
     "typescript-eslint": "~8.31.1",
-    "unified": "^11.0.5",
     "user-agent-data-types": "0.4.2"
   }
-}
+}

apps/site/pages/en/blog/announcements/v20-release-announce.md

@@ -109,9 +109,9 @@ The test runner also includes some parts that are not yet stable, including repo
 This is a simple example of using the test runner:
 
 ```mjs
-import { test, mock } from 'node:test';
 import assert from 'node:assert';
 import fs from 'node:fs';
+import { test, mock } from 'node:test';
 
 mock.method(fs, 'readFile', async () => 'Hello World');
 test('synchronous passing test', async t => {

apps/site/pages/en/blog/community/domain-postmortem.md

@@ -20,19 +20,21 @@ the originator of the code from knowing about its own exceptions.
 
 Here's an example of how one indirectly linked modules can affect another:
 
-```js
-// module a.js
+```js displayName="a.js"
+const d = require('domain').create();
+
 const b = require('./b');
 const c = require('./c');
+```
 
-// module b.js
-const d = require('domain').create();
+```js displayName="b.js"
 d.on('error', () => {
   /* silence everything */
 });
 d.enter();
+```
 
-// module c.js
+```js displayName="c.js"
 const dep = require('some-dep');
 dep.method(); // Uh-oh! This method doesn't actually exist.
 ```
@@ -187,11 +189,11 @@ const pipeList = [];
 const FILENAME = '/tmp/tmp.tmp';
 const PIPENAME = '/tmp/node-domain-example-';
 const FILESIZE = 1024;
-var uid = 0;
+let uid = 0;
 
 // Setting up temporary resources
 const buf = Buffer(FILESIZE);
-for (var i = 0; i < buf.length; i++) buf[i] = ((Math.random() * 1e3) % 78) + 48; // Basic ASCII
+for (let i = 0; i < buf.length; i++) buf[i] = ((Math.random() * 1e3) % 78) + 48; // Basic ASCII
 fs.writeFileSync(FILENAME, buf);
 
 function ConnectionResource(c) {
@@ -249,7 +251,7 @@ net
 
 function streamInParts(fd, cr, pos) {
   const d2 = domain.create();
-  var alive = true;
+  const alive = true;
   d2.on('error', er => {
     print('d2 error:', er.message);
     cr.end();
@@ -301,12 +303,12 @@ function pipeData(cr) {
     });
   });
   cr.on('data', chunk => {
-    for (var i = 0; i < connectionList.length; i++) {
+    for (let i = 0; i < connectionList.length; i++) {
       connectionList[i].write(chunk);
     }
   });
   cr.on('end', () => {
-    for (var i = 0; i < connectionList.length; i++) {
+    for (let i = 0; i < connectionList.length; i++) {
       connectionList[i].end();
     }
     ps.close();
@@ -318,11 +320,13 @@ function pipeData(cr) {
 process.on('SIGINT', () => process.exit());
 process.on('exit', () => {
   try {
-    for (var i = 0; i < pipeList.length; i++) {
+    for (let i = 0; i < pipeList.length; i++) {
       fs.unlinkSync(pipeList[i]);
     }
     fs.unlinkSync(FILENAME);
-  } catch (e) {}
+  } catch (e) {
+    // Handle the error here
+  }
 });
 ```
 
@@ -410,7 +414,7 @@ DataStream.prototype.data = function data(chunk) {
   this.domain.run(function () {
     // Simulate an async operation that does the data transform.
     setImmediate(() => {
-      for (var i = 0; i < chunk.length; i++)
+      for (let i = 0; i < chunk.length; i++)
         chunk[i] = ((chunk[i] + Math.random() * 100) % 96) + 33;
       // Grab the instance from the active domain and use that
       // to call the user's callback.

apps/site/pages/en/blog/feature/streams2.md

@@ -268,7 +268,7 @@ this:
 // and an `ondata` member that gets called when it has data, and
 // an `onend` member that gets called when the data is over.
 
-var stream = new Readable();
+const stream = new Readable();
 
 source.ondata = function (chunk) {
   // if push() returns false, then we need to stop reading from source
@@ -316,15 +316,14 @@ function SimpleProtocol(source, options) {
   // source is a readable stream, such as a socket or file
   this._source = source;
 
-  var self = this;
-  source.on('end', function () {
-    self.push(null);
+  source.on('end', () => {
+    this.push(null);
   });
 
   // give it a kick whenever the source is readable
   // read(0) will not consume any bytes
-  source.on('readable', function () {
-    self.read(0);
+  source.on('readable', () => {
+    this.read(0);
   });
 
   this._rawHeader = [];
@@ -337,14 +336,14 @@ SimpleProtocol.prototype = Object.create(Readable.prototype, {
 
 SimpleProtocol.prototype._read = function (n) {
   if (!this._inBody) {
-    var chunk = this._source.read();
+    const chunk = this._source.read();
 
     // if the source doesn't have data, we don't have data yet.
     if (chunk === null) return this.push('');
 
     // check if the chunk has a \n\n
-    var split = -1;
-    for (var i = 0; i < chunk.length; i++) {
+    let split = -1;
+    for (let i = 0; i < chunk.length; i++) {
       if (chunk[i] === 10) {
         // '\n'
         if (this._sawFirstCr) {
@@ -365,9 +364,9 @@ SimpleProtocol.prototype._read = function (n) {
       this.push('');
     } else {
       this._inBody = true;
-      var h = chunk.slice(0, split);
+      const h = chunk.slice(0, split);
       this._rawHeader.push(h);
-      var header = Buffer.concat(this._rawHeader).toString();
+      const header = Buffer.concat(this._rawHeader).toString();
       try {
         this.header = JSON.parse(header);
       } catch (er) {
@@ -376,7 +375,7 @@ SimpleProtocol.prototype._read = function (n) {
       }
       // now, because we got some extra data, unshift the rest
       // back into the read queue so that our consumer will see it.
-      var b = chunk.slice(split);
+      const b = chunk.slice(split);
       this.unshift(b);
 
       // and let them know that we are done parsing the header.
@@ -385,13 +384,13 @@ SimpleProtocol.prototype._read = function (n) {
   } else {
     // from there on, just provide the data to our consumer.
     // careful not to push(null), since that would indicate EOF.
-    var chunk = this._source.read();
+    const chunk = this._source.read();
     if (chunk) this.push(chunk);
   }
 };
 
 // Usage:
-var parser = new SimpleProtocol(source);
+const parser = new SimpleProtocol(source);
 // Now parser is a readable stream that will emit 'header'
 // with the parsed header data.
 ```
@@ -408,10 +407,12 @@ as its data source.
 For example:
 
 ```javascript
-var OldReader = require('./old-api-module.js').OldReader;
-var oreader = new OldReader();
-var Readable = require('stream').Readable;
-var myReader = new Readable().wrap(oreader);
+const Readable = require('stream').Readable;
+
+const OldReader = require('./old-api-module.js').OldReader;
+
+const oreader = new OldReader();
+const myReader = new Readable().wrap(oreader);
 
 myReader.on('readable', function () {
   myReader.read(); // etc.
@@ -793,8 +794,8 @@ SimpleProtocol.prototype = Object.create(Transform.prototype, {
 SimpleProtocol.prototype._transform = function (chunk, encoding, done) {
   if (!this._inBody) {
     // check if the chunk has a \n\n
-    var split = -1;
-    for (var i = 0; i < chunk.length; i++) {
+    let split = -1;
+    for (let i = 0; i < chunk.length; i++) {
       if (chunk[i] === 10) {
         // '\n'
         if (this._sawFirstCr) {
@@ -814,9 +815,9 @@ SimpleProtocol.prototype._transform = function (chunk, encoding, done) {
       this._rawHeader.push(chunk);
     } else {
       this._inBody = true;
-      var h = chunk.slice(0, split);
+      const h = chunk.slice(0, split);
       this._rawHeader.push(h);
-      var header = Buffer.concat(this._rawHeader).toString();
+      const header = Buffer.concat(this._rawHeader).toString();
       try {
         this.header = JSON.parse(header);
       } catch (er) {
@@ -836,7 +837,7 @@ SimpleProtocol.prototype._transform = function (chunk, encoding, done) {
   done();
 };
 
-var parser = new SimpleProtocol();
+const parser = new SimpleProtocol();
 source.pipe(parser);
 
 // Now parser is a readable stream that will emit 'header'

apps/site/pages/en/blog/module/service-logging-in-json-with-bunyan.md

@@ -122,8 +122,8 @@ make
 Our [server](https://github.com/trentm/hello-json-logging/blob/master/server.js) first creates a Bunyan logger:
 
 ```javascript
-var Logger = require('bunyan');
-var log = new Logger({
+const Logger = require('bunyan');
+const log = new Logger({
   name: 'helloapi',
   streams: [
     {
@@ -153,7 +153,7 @@ Bunyan has the concept of **serializers**: a registry of functions that know how
 Restify 1.x and above has bunyan support baked in. You pass in your Bunyan logger like this:
 
 ```javascript
-var server = restify.createServer({
+const server = restify.createServer({
   name: 'Hello API',
   log: log, // Pass our logger to restify.
 });
@@ -163,7 +163,7 @@ Our simple API will have a single `GET /hello?name=NAME` endpoint:
 
 ```javascript
 server.get({ path: '/hello', name: 'SayHello' }, function (req, res, next) {
-  var caller = req.params.name || 'caller';
+  const caller = req.params.name || 'caller';
   req.log.debug('caller is "%s"', caller);
   res.send({ hello: caller });
   return next();
@@ -205,7 +205,7 @@ server.pre(function (request, response, next) {
 This is the first time we've seen this `log.info` style with an object as the first argument. Bunyan logging methods (`log.trace`, `log.debug`, ...) all support an optional **first object argument with extra log record fields**:
 
 ```javascript
-log.info(<object> fields, <string> msg, ...)
+log.info(/* object */ fields, /* string */ msg /* ... */);
 ```
 
 Here we pass in the restify Request object, `req`. The "req" serializer we registered above will come into play here, but bear with me.
@@ -250,8 +250,9 @@ Here is the server log:
 
 Lets look at each in turn to see what is interesting -- pretty-printed with `node server.js | ./node_modules/.bin/bunyan -j`:
 
-```javascript
-{                                                   // (1)
+```json
+{
+  // (1)
   "name": "helloapi",
   "hostname": "banana.local",
   "pid": 40442,
@@ -277,8 +278,9 @@ Here we logged the incoming request with `request.log.info({req: request}, 'star
 
 Next the `req.log.debug` in our handler:
 
-```javascript
-{                                                   // (2)
+```json
+{
+  // (2)
   "name": "helloapi",
   "hostname": "banana.local",
   "pid": 40442,
@@ -293,8 +295,9 @@ Next the `req.log.debug` in our handler:
 
 and the log of response in the "after" event:
 
-```javascript
-{                                                   // (3)
+```json
+{
+  // (3)
   "name": "helloapi",
   "hostname": "banana.local",
   "pid": 40442,

apps/site/pages/en/blog/release/v12.17.0.md

@@ -49,8 +49,8 @@ HTTP request entering in a server, it will be possible to retrieve this id
 without having access the current HTTP request:
 
 ```js
-const http = require('http');
 const { AsyncLocalStorage } = require('async_hooks');
+const http = require('http');
 
 const asyncLocalStorage = new AsyncLocalStorage();
 

apps/site/pages/en/blog/release/v16.14.0.md

@@ -15,7 +15,7 @@ This release adds experimental support for the import assertions stage 3 proposa
 To keep Node.js ESM implementation as compatible as possible with the HTML spec, import assertions are now required to import JSON modules (still behind the `--experimental-json-modules` CLI flag):
 
 ```mjs
-import info from `./package.json` assert { type: `json` };
+import info from './package.json' assert { type: `json` };
 ```
 
 Or use dynamic import: