{"id":19947,"library":"eslint-plugin-ssr-friendly","title":"eslint-plugin-ssr-friendly","description":"ESLint plugin that detects incorrect use of DOM globals (e.g., window, document, navigator) in module scope, constructors, React component render methods, and function components, ensuring code is safe for server-side rendering (SSR) and Node.js environments. Stable version 1.3.0 as of August 2023. It focuses on preventing runtime errors during SSR by catching patterns that assume a browser environment. Unlike general linting rules, it provides specific rules for React class components, function components, and class constructors. Released under MIT license with monthly releases.","status":"active","version":"1.3.0","language":"javascript","source_language":"en","source_url":"https://github.com/kopiro/eslint-plugin-ssr-friendly","tags":["javascript","eslint","eslintplugin","ssr","server-side-rendering","globals","react","nodejs"],"install":[{"cmd":"npm install eslint-plugin-ssr-friendly","lang":"bash","label":"npm"},{"cmd":"yarn add eslint-plugin-ssr-friendly","lang":"bash","label":"yarn"},{"cmd":"pnpm add eslint-plugin-ssr-friendly","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"peer dependency required for plugin to work","package":"eslint","optional":false}],"imports":[{"note":"ESM default import; CommonJS also works as the package provides both.","wrong":"const eslintPluginSsrFriendly = require('eslint-plugin-ssr-friendly');","symbol":"plugin","correct":"import eslintPluginSsrFriendly from 'eslint-plugin-ssr-friendly';"},{"note":"Named export for accessing rule definitions directly.","wrong":"const rules = require('eslint-plugin-ssr-friendly').rules;","symbol":"rules","correct":"import { rules } from 'eslint-plugin-ssr-friendly';"},{"note":"Named export for accessing preset configs (e.g., 'recommended').","wrong":"const configs = require('eslint-plugin-ssr-friendly').configs;","symbol":"configs","correct":"import { configs } from 'eslint-plugin-ssr-friendly';"}],"quickstart":{"code":"// Install the plugin\n// npm install --save-dev eslint-plugin-ssr-friendly\n\n// In .eslintrc.js\nmodule.exports = {\n  plugins: ['ssr-friendly'],\n  extends: ['plugin:ssr-friendly/recommended'],\n  rules: {\n    'ssr-friendly/no-dom-globals-in-module-scope': 'error',\n    'ssr-friendly/no-dom-globals-in-constructor': 'error',\n    'ssr-friendly/no-dom-globals-in-react-cc-render': 'error',\n    'ssr-friendly/no-dom-globals-in-react-fc': 'error',\n  },\n};\n\n// Example code that will trigger errors:\n// const width = window.innerWidth; // module scope error\n// class MyComp extends React.Component {\n//   render() { return <div>{window.innerWidth}</div>; } // render error\n// }","lang":"javascript","description":"Quick setup using recommended config; shows how to enable all rules and example violations."},"warnings":[{"fix":"Manually review code that accesses DOM globals through functions or variables.","message":"The plugin only detects direct use of DOM globals in certain scopes; it does not catch indirect access via helper functions or properties.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Ensure all uses of DOM globals in functions are guarded with 'if (typeof window !== \"undefined\")'.","message":"Rules cannot verify that DOM globals used inside functions are guarded by a typeof check. For example, 'const isRetina = () => devicePixelRatio >= 2' is allowed even if called unconditionally.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Specify exact version in package.json (e.g., \"eslint-plugin-ssr-friendly\": \"1.3.0\") and review changelog before upgrading.","message":"The 'recommended' config may change between minor versions; pin your eslint-plugin-ssr-friendly version to avoid unexpected rule changes.","severity":"deprecated","affected_versions":">=1.0.0"}],"env_vars":null,"search_vec":"'1.3.0':45 '2023':49 'assum':62 'august':48 'browser':64 'catch':59 'class':76,81 'code':31 'compon':24,29,77,79 'constructor':22,82 'detect':9 'document':17 'dom':13 'e.g':15 'ensur':30 'environ':42,65 'error':55 'eslint':2,6,91 'eslint-plugin-ssr-friend':1 'eslintplugin':92 'focus':51 'friend':5 'function':28,78 'general':67 'global':14,98 'incorrect':10 'javascript':90 'licens':86 'lint':68 'method':26 'mit':85 'modul':20 'month':88 'navig':18 'node.js':41 'nodej':100 'pattern':60 'plugin':3,7 'prevent':53 'provid':71 'react':23,75,99 'releas':83,89 'render':25,38,97 'rule':69,73 'runtim':54 'safe':33 'scope':21 'server':36,95 'server-sid':35 'server-side-rend':94 'side':37,96 'specif':72 'ssr':4,39,57,93 'stabl':43 'unlik':66 'use':11 'version':44 'window':16","created_at":"2026-04-25T11:20:30.833578+00:00","updated_at":"2026-04-25T11:20:30.833578+00:00","problems":[{"fix":"Ensure 'eslint-plugin-ssr-friendly' is installed and added to plugins: ['ssr-friendly'].","cause":"The plugin is not installed or not listed in the 'plugins' array.","error":"Definition for rule 'ssr-friendly/no-dom-globals-in-module-scope' was not found."},{"fix":"Run 'npm install --save-dev eslint-plugin-ssr-friendly'.","cause":"The plugin package is missing from node_modules.","error":"ESLint couldn't find the plugin \"eslint-plugin-ssr-friendly\"."}],"ecosystem":"npm","meta_description":null,"install_score":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":"","cli_version":null,"type":"library","homepage":null,"github":"https://github.com/kopiro/eslint-plugin-ssr-friendly","docs":null,"changelog":null,"pypi":null,"npm":"https://www.npmjs.com/package/eslint-plugin-ssr-friendly","openapi_spec":null,"status_page":null,"smithery":null,"categories":["testing","web-framework"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-06-17","next_check":"2026-07-24","install_tag":null}}