Yes, you can make files read-only in Visual Studio Code to prevent accidental changes. VS Code offers several built-in methods to achieve this, including a session-based command, user and workspace settings for automatically including/excluding files, and respecting file system permissions.
This provides flexibility, from locking a single file for a review to protecting an entire directory of critical project files.
Method 1: Toggle read-only for the active editor (session-based)
This is the most direct approach for quickly setting the current file to read-only. It is temporary and does not affect the file on your disk.
- Open the file you wish to make read-only.
- Open the Command Palette by pressing
Ctrl+Shift+Pon Windows/Linux orCmd+Shift+Pon macOS. - Type
Readonlyand select the command Toggle Active Editor Read-only in Session. - A lock icon will appear in the editor tab to indicate that the file is now read-only.
- To make the file writable again, simply open the Command Palette and run the same Toggle command. Alternatively, if you try to type, a pop-up will offer to make the file writable.
Method 2: Configure read-only for specific files or folders (settings-based)
This method uses VS Code's settings to define patterns for files and folders that should automatically open in read-only mode. This is ideal for safeguarding dependencies or generated code that you should not edit directly, like the node_modules or dist folders.
- Open VS Code settings by pressing
Ctrl+,on Windows/Linux orCmd+,on macOS. - Search for
readonly. - The most useful settings are
Files: Readonly IncludeandFiles: Readonly Exclude. - Click Add Pattern in the Files: Readonly Include setting.
- In the input field, enter a glob pattern to specify which files or directories to lock.
- To lock a specific directory:
path/to/my-folder/**. The**wildcard matches all files and subdirectories recursively. - To lock a specific file type:
**/*.js.map. - To lock a folder like
node_modules:**/node_modules/**.
- To lock a specific directory:
- Files matching these patterns will automatically have the lock icon when opened.
Using files.readonlyExclude: You can also define an exclusion pattern to prevent specific files from being marked as read-only, even if they match an include pattern.
Method 3: Honor file system permissions
VS Code can be configured to respect the read-only attributes set at the operating system level.
- Change OS file permissions:
- On Windows: Right-click the file or folder in File Explorer, select Properties, and check the Read-only box under the General tab.
- On macOS/Linux: Use the
chmodcommand in the terminal. For example,chmod -w my-file.jsremoves write permissions for the owner.
- Configure VS Code:
- Open VS Code settings (
Ctrl+,orCmd+,). - Search for
readonlyFromPermissions. - Enable the
Files: Readonly From Permissionssetting. When enabled, VS Code will mark files as read-only if their file permissions indicate as such.
- Open VS Code settings (
Method 4: Use a third-party extension
For more advanced control, especially for non-workspace files or to indicate read-only status in the status bar, you can install an extension from the Visual Studio Marketplace.
- Open the Extensions view by clicking the Extensions icon in the Activity Bar or by pressing
Ctrl+Shift+X. - Search for an extension like Read-only: Non-workspace files or Read-Only Indicator.
- Follow the extension's instructions to configure it. Some extensions can automatically set files outside your project as read-only, preventing accidental changes to system files.
Summary of methods
| Method | Use Case | Impact | Key Actions |
|---|---|---|---|
| Active Editor Toggle | Quickly lock/unlock the current file for a session. | Temporary, session-based only. Does not change file on disk. | Command Palette: Toggle Active Editor Read-only in Session. |
| Settings (Glob Patterns) | Automatically lock specific file types or folders (e.g., node_modules, dist). |
Persistent across sessions and projects via settings. | Settings: files.readonlyInclude, files.readonlyExclude. |
| File System Permissions | Enforce OS-level read-only attributes, applying globally. | Affects all programs that interact with the file. | OS File Properties (chmod on Linux), VS Code Setting: files.readonlyFromPermissions. |
| Extension | Advanced control, automatic locking of non-workspace files, or enhanced status indicators. | Varies by extension; can be very powerful but requires installation. | Install extension from Marketplace. |
Practical considerations
- Session-based vs. Persistent: Understand the difference between a temporary, session-only lock and a persistent one set via settings or file permissions. A session lock is good for a quick review, while settings are better for long-term project configuration.
- Glob Pattern Syntax: When using settings, master the glob pattern syntax. Use
**to match recursive directories and*for single file names. - Read-only Indicators: Keep an eye on the padlock icon in the editor tab. This is your visual confirmation that the file is protected.
- Overriding a Lock: Remember that file locks in VS Code are a protective measure, not a permanent barrier. You can always use the Command Palette to change a file's state back to writable, or modify the settings or file permissions.