liuliangsir / react-hot-boilerplate-vscode

React Hot Loader 3.0 Boilerplate for Visual Studio Code

React Hot Loader 3.0 Boilerplate for Visual Studio Code

A react boilerplate project for Visual Studio Code based on react-transform-boilerplate and React Hot Loader 3.0

---

Features

• Intellisense (code completion) for external libraries via Automatic Type Acquisition (ATA)
• Debugging react ES2015 classes inside vscode via vscode-chrome-debug extension
• Easy access to install, build and debugging commands via vscode command palette and keyboard shortcuts
• JSX code analysis (linting) with autofixing support via vscode-eslint extension
• React Hot Loading

Server and Client Side Debugging

react-hot-boilerplate-vscode-fullstack (by GGAlanSmithee)

Visual Studio Code

• Download
• Tips and Tricks
• Supercharge your JavaScript debugging workflow with Visual Studio Code (Build 2017)

Required Extensions

• vscode-chrome-debug
• vscode-eslint

Recommended Extensions

• ReactSnippets
• vscode-npm
• npm-intellisense

Installation

1. git clone https://github.com/skolmer/react-hot-boilerplate-vscode.git
2. open react-hot-boilerplate-vscode in Visual Studio Code
3. make sure you have vscode-chrome-debug and vscode-eslint extension installed
4. press F1 > Run Task > install (or npm install) to install all dependencies
5. run /c/Program\ Files\ \(x86\)/Google/Chrome/Application/chrome.exe --remote-debugging-port=9222 --incognito in terminal
6. press F5 to start debugging

Visual Studio Code shortcuts

• F5 to start debugging
• CTRL+SHIFT+B to build a production release
• CTRL+SHIFT+T to run eslint

Troubleshooting

• How to make Chrome always launch with remote-debugging-port flag

License

CC0 (public domain)