Setting up a React Playground Dev Environment
When exploring a new framework or technology, it is nice to have a seed project or sandbox so you can just get in and start playing. Let's build our React playground using npm, browserify, 6to5, and more within WebStorm!
How do I get npm packages installed with --save-dev to run with no prefix in the command line?
When I install the packages and try to run watchify, for example, I get "command not found"
Your best options:
Install with "-g" so watchify is available globally on the path (as well as locally)
Create a package.json with watchify saved as a script like I do at the end of the video.
Otherwise there's no simple/practical way for your terminal to know that "watchify" refers to your locally installed copy without manually setting up a reference.
I think I found a third option
export PATH=$(npm bin):$PATH
You can add this to your .bashrc / .zshrc file to always add the local npm bin path to your $PATH.
Following this same pattern, you can do a bundle exec equivalent with an alias.
alias npm-exec='PATH=$(npm bin):$PATH'
so with that, you can do
npm-exec watchify in your local directory.
I personally like the first option better, though.
How do i use watchify to watch an entire directory versus just app.aspx? Must i use something like gulp?
Great lesson, by the way!
Browserify (which watchify uses) expects an "entry file" where you require() all of your dependencies. It will transform/compile them all into a single bundle file. So you only watch one file.
There are more examples and docs here: https://github.com/substack/node-browserify#usage
Do I use babel now?
Very great teacher! Was a smooth lesson start to finish.
Very great teacher! Was a smooth lesson start to finish.
It seems like React isn't loading for me. i'm getting a console error: "React.render is not a function" Any idea what can cause this?