Commit Graph

2 Commits

Author SHA1 Message Date
Alex Hunt
53dda9e542 Format code-workspace file, clarify use of .vscode/ dir (#44874)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44874

While reviewing https://github.com/facebook/react/pull/29830, I noticed this file was committed with tab indentation in React Native. I have also used the `.gitignore` entry to clarify how `react-native.code-workspace` interacts with an optional user `.vscode/` config directory.

Note: The `json-stringify` parser can be used with Prettier 3+ only, so we use `json` instead.

Changelog: [Internal]

Reviewed By: vzaidman

Differential Revision: D58413581

fbshipit-source-id: 58c14db6648fed10736062b1f055475154aa74a4
2024-06-11 09:27:48 -07:00
Alex Hunt
9c00d6d332 Add VS Code workspace config (#43851)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/43851

## Summary

Adds a `react-native.code-workspace` workspace file when using VS Code. This disables the built-in TypeScript Language Service for `.js` files, recommends extensions, enables `formatOnSave`, and configures Flow language support.

We will recommend this workspace config in our contributing guide: https://github.com/facebook/react-native-website/pull/4075.

**Motivation**

This is a DevX benefit for **React Native contributors** using open source VS Code — in particular to help with recent/trivial papercuts in PRs such as inserting a final newline in files (configured by EditorConfig).

**Recommended extensions**

NOTE: The recommended extensions list is currently minimal — happy to extend this now or in future, but let's aim to keep these conservative.

- Flow — language support
- EditorConfig — formatting based on `.editorconfig`, all file types
- Prettier — formatting for JS* files
- ESLint — linter for JS* files

**Why `react-native.code-workspace`?**

`.code-workspace` files have slight extra behaviours over a `.vscode/` directory:
- Allows user to opt-in or skip.
- Allows double-click launching from file managers.
- Allows base folder (and any subfolders in future) to be opened with local file tree scope (useful in fbsource!)
- (Minor point) Single config file over multiple files.

https://code.visualstudio.com/docs/editor/workspaces

Changelog: [Internal]

## Test plan

Aganst a new unconfigured copy of Visual Studio Code Insiders.

**Without workspace config**

 `.js` files raise errors by default (built-in TypeScript language service)

 {F1478195672}

 When using the Flow VS Code extension, the wrong version (global) of Flow is used.

**With workspace config**

 Workspace config is suggested when folder is opened in VS Code

 {F1478194795}

 Dialog is shown on workspace launch with recommended VS Code extensions

{F1478196003}

 Built-in TypeScript Language Service is disabled for `.js` files
 Flow language support is configured correctly against `flow` version in `package.json`

{F1478291085}
{F1478200649}

Reviewed By: motiz88

Differential Revision: D55698495

fbshipit-source-id: b0b2f459cf05afc3e7862c9845066a66aaa1985b
2024-04-04 09:04:20 -07:00