{"id":18228,"library":"codemirror-formatting","title":"CodeMirror Formatting Addon","description":"A standalone, modular packaging of the original CodeMirror formatting addon (v1.0.0), designed to simplify inclusion in module-based projects. Originally extracted from the official CodeMirror v2 demo page, this package provides basic code formatting capabilities (auto-indent and comment toggling) for CodeMirror editors. The release cadence is low; the package has been stable since 2016. Unlike the built-in formatting in CodeMirror v5+, this addon is compatible with older CodeMirror versions (2.x) and does not require a full migration. It ships as a single JavaScript file and is intended for use with browser module loaders or bundlers.","status":"active","version":"1.0.0","language":"javascript","source_language":"en","source_url":"https://github.com/artf/codemirror-formatting","tags":["javascript","codemirror","formatting"],"install":[{"cmd":"npm install codemirror-formatting","lang":"bash","label":"npm"},{"cmd":"yarn add codemirror-formatting","lang":"bash","label":"yarn"},{"cmd":"pnpm add codemirror-formatting","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"peer dependency: requires CodeMirror editor instance to attach formatting commands","package":"codemirror","optional":true}],"imports":[{"note":"The module has no default export; it patches the global CodeMirror object.","wrong":"import formatting from 'codemirror-formatting'","symbol":"default (formatting module)","correct":"import 'codemirror-formatting'"},{"note":"Commands are added to CodeMirror.commands; no named exports are available.","wrong":"import { indentMore } from 'codemirror-formatting'","symbol":"CodeMirrorCommands (if using named import)","correct":"import 'codemirror-formatting'; // then use CodeMirror.commands.indentMore, etc."},{"note":"Works with Node.js/bundlers. The module side-effects CodeMirror global.","wrong":"","symbol":"CommonJS require","correct":"require('codemirror-formatting')"},{"note":"Type definitions are not bundled; use a .d.ts file or add triple-slash reference.","wrong":"import type {} from 'codemirror-formatting'","symbol":"TypeScript types","correct":"/// <reference types=\"codemirror-formatting\" />"}],"quickstart":{"code":"// Ensure CodeMirror is loaded first. Then import the formatting addon.\n// It automatically extends CodeMirror.commands.\nimport CodeMirror from 'codemirror';\nimport 'codemirror/lib/codemirror.css';\nimport 'codemirror/mode/javascript/javascript';\nimport 'codemirror-formatting';\n\nconst editor = CodeMirror(document.getElementById('editor'), {\n  mode: 'javascript',\n  lineNumbers: true\n});\n\n// Use the formatting commands:\neditor.execCommand('indentMore');     // Indent selection\neditor.execCommand('indentLess');     // Unindent selection\neditor.execCommand('autoIndent');     // Auto-indent selection or line\neditor.execCommand('toggleComment');  // Toggle line comment","lang":"javascript","description":"Shows how to import the formatting addon and use its commands (indentMore, indentLess, autoIndent, toggleComment) on a CodeMirror editor."},"warnings":[{"fix":"Upgrade to CodeMirror v5+ and use its built-in formatting commands (e.g., indentMore, indentLess).","message":"This addon only works with CodeMirror versions 2.x~4.x. It does not support CodeMirror v5+ (which has built-in formatting).","severity":"breaking","affected_versions":">=1.0.0"},{"fix":"Ensure this import is only done once in your application.","message":"The addon modifies CodeMirror.commands globally. If using multiple editor instances, all will be affected.","severity":"gotcha","affected_versions":">=0.0.0"},{"fix":"Consider using the official CodeMirror formatting addon from @codemirror/format or codemirror/addon/comment/comment.js.","message":"This package has not been updated since 2016 and may have compatibility issues with modern bundlers.","severity":"deprecated","affected_versions":">=1.0.0"},{"fix":"Test with your specific mode or use a mode that defines indentUnit.","message":"The 'autoIndent' command may not work as expected if the CodeMirror mode does not support indentation.","severity":"gotcha","affected_versions":">=0.0.0"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Run npm install codemirror-formatting or add it to package.json.","cause":"Package not installed or not resolved by bundler.","error":"Error: Cannot find module 'codemirror-formatting'"},{"fix":"Ensure CodeMirror is imported and available globally (e.g., import 'codemirror' before 'codemirror-formatting').","cause":"CodeMirror is not loaded before the formatting addon is imported.","error":"Uncaught TypeError: Cannot read properties of undefined (reading 'commands')"},{"fix":"Verify that the addon is imported and that you are using a compatible CodeMirror version (2.x–4.x).","cause":"The formatting addon has not been applied properly, or using CodeMirror v5+ which has its own commands.","error":"'indentMore' is not a known command"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}