react-native-vscode-settings
v1.0.0
Published
Visual Studio Code settings for React Native
Downloads
94
Maintainers
Readme
React Native VSCode Settings
Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications. Visual Studio Code is free and available on your favorite platform - Linux, Mac OSX, and Windows.
This module will install visual studio code
essential extensions and settings for react-native
.
Run react-native-vscode-settings
npx react-native-vscode-settings
On install
it will automatically install all plugins configured in library.
Note:
- Copy your vscode settings defined in your
.vscode/settings.json
file before installing this package.- If you are using MAC then please make your that you have install
code
command in PATH. Please refer Microsoft Blog for more details.- All plugins are defined in package.json
postinstall
section.- These prepacked plugins will definitely help developers of React & ReactNative community
Essential Extensions
- React Native Tools
- Auto Close Tag
- Auto Complete Tag
- Auto Rename Tag
- Babel JavaScript
- Code Spellcheker
- Color Highlight
- Document This by oouo-diogo-perdigao
- ESLint
- Git Blame
- GitLens — Git supercharged
- Import Cost
- Indenticator
- Lorem ipsum
- markdownlist
- Output Colorizer
- Path Intellisense
- Peep
- Prettier - JavaScript formatter
- React-Native/React/Redux snippets for es6/es7
- TODO Highlight
- vscode-icons
Settings
To get to the user and workspace settings:
- On a Windows computer, click File > Preferences > Settings or Press CTRL + ,
- On a Mac, click Code > Preferences > Settings or Press ⌘ + ,
Paste following code with your design settings.
{
// The number of spaces in a tab.
"editor.tabSize": 2,
// Specifies workbench icon theme.
"workbench.iconTheme": "vscode-icons",
// Format a file on save.
"editor.formatOnSave": true,
// Set Prettier default as formatter
"editor.defaultFormatter": "esbenp.prettier-vscode",
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
// Controls how the editor should render whitespace characters.
"editor.renderWhitespace": "boundary",
// Quickly toggle between hiding and showing folders and files. (For Peep)
// To quickly hide/show files execute the Peep Toggle in Command Palette.
"files.exclude": {
".*": false,
"ios/": false,
"*.lo*": false,
"LICENSE": false,
"android/": false,
"__tests__": false,
"node_modules/": false
}
}
Launching from the Command Line
You can also run VS Code from the terminal by typing code
after adding it to the path:
- Launch VS Code.
- Open the Command Palette (⇧ + ⌘ + P)/(CRTL + SHIFT + P) and type
shell command
to find the Shell Command: Installcode
command in PATH command. - Restart the terminal for the new
$PATH
value to take effect.
Use the command code /path/to/file/or/directory/you/want/to/open
to open your file or code .
to open the current directory in VS Code
.
Contributions
Contribute to this project by opening a pull request, providing suggestions, giving feedback, reporting issues, making a donation or any type of contribution will be very much appreciated.
Follow me on Twitter: @shukerullah
Support this Project
Your support helps keep this project going!
PayPal: If you'd like to make a donation via PayPal:
Buy Me a Coffee: Alternatively, you can also support this project by buying me a coffee!