Check out a free preview of the full Complete Introduction to React (feat. Redux and React Router) course:
The "NPM Scripts" Lesson is part of the full, Complete Introduction to React (feat. Redux and React Router) course featured in this preview video. Here's what you'd learn in this lesson:

Brian will be using NPM scripts to add automation to his workflow. NPM scripts are defined in the package.json file. The first script he creates is the ‘test’ script which will run the StandardJS linter.

Get Unlimited Access Now

Transcript from the "NPM Scripts" Lesson

[00:00:00]
>> [MUSIC]

[00:00:03]
>> Brian Holt: Now we're going to do MPM scripts, so open your package.JSON, and I have all these in here, so I'm going to quickly delete all of them so you don't see them.an Just kidding, whatever you can see it's fine.
>> Speaker 2: Someone asked if there's a way to put standard in sublime text so that every time you save the file it does it for you?

[00:00:22]
>> Brian Holt: There is, I don't know how or like at an off the top my head, but it's should be pretty easy for you to set up. I imagine the if I hit Shift+Control package install
>> Brian Holt: And they say like standard format. Yeah, we could put that on. I choose not to because at Netflix if I tried to take out semi-colons there would be all out war ending in someone getting fired and or dead.

[00:00:54] So, I choose not to because I have to switch back between personal products and my Netflix work weird. So, yeah, you can use standard format, and I think it will actually do it'll tell you in the gutter, if you're like, you can see here where I have like these little markings right here, that's my get gutter.

[00:01:16] That's tell me things that I that's changed since I last committed. it will give you the same sort of errors like hey you have a linting error on this line which is pretty nice too. Okay, good questions, though, so let's talk about MPM scripts. So anyone that's been working in the JavaScript community a while has used something like Gulp, or Grunt, or Broccoli or ten thousand others that I'm not going to think of right now.

[00:01:49] Most of us have used at least Gulp or Grunt. Those tend to be the two bigger ones. They are awesome tools, particularly when you start having really big, really complicated builds. In our particular case we have a pretty simple build. So what we're going to do is we're going to be using what's called ten pm scripts which are basically bash commands that we're going to pipe into.

[00:02:12] Bashers Issus H, or whatever. Anyway, the things that you pipe into the command line that basically wrote your scripts for you. It's like a runs or build roads or tests or and all that kind of stuff, so let's do it now we're going to call it test and then over here you just put whatever you want run.

[00:02:34] So, in our particular case, we want it to just run standard. Now that seems like they're not super compelling reason to use this because how hard is it to remember a standard But once we have like ten different things that we need to be able to do. They end up being like having like ten feature flags and we're running three different scripts at once, right.

[00:02:51] Like, this gets to be really useful because you no longer have to have this like. You no longer have to remember what you have to type in. That you can just remember, I just need to write npm test and it's done. Yeah, we put the scripts here, and we did a test, and we put standard there, right?

[00:03:09]
>> Brian Holt: Right, so put that in, save it.
>> Brian Holt: And now come over to your command line. So instead of running standard, we can do npm run, and then, so you do npm run, and that's letting npm know I want you to run one of my scripts for me.

[00:03:26] So anything you put in here, I could put blah, right? If I said MP.run blah, it's going to run standard for me, right? We choose The node community that if you run npm run test it's gonna run your tests for you. To the point that they've actually written some shortcuts for it.

[00:03:53] So if we put test here instead, Like I said, you can do npm run test, but there's a handful of special scripts that I can actually just run without test. So if I say mpm test it will work. And it actually even mpmt works. But just know like I can't change this to blah and say mpm blah that's not going to work right.

[00:04:20] So tests is a special one. Start is another one that is special. theres other ones like pre-publish and published, but we're not to worry about those. The two that you should worry about are test and start. So yeah, I wanna to put this to test.
>> Brian Holt: Any questions about that?

[00:04:51]
>> Speaker 3: We're getting errors when we run that.
>> Speaker 2: Well I fixed mine but-
>> Brian Holt: Are you getting errors when you run-
>> Speaker 2: I was just missing a comma. So it's something with your.
>> Speaker 3: I'm just getting an error. Nevermind.
>> Brian Holt: Okay. Anyone else getting the errors? What's your error say?

[00:05:08]
>> Speaker 4: It's so weird. Missing script? Missing script block.
>> Brian Holt: Just come into your package.json. Make sure this is called scripts Yeah, better, cool. Do you find your error back there? Okay.
>> Speaker 5: There's a question here from Chad, is it common to use NPM to install packages locally instead of having to install them globally

[00:05:41]
>> Brian Holt: for example web pack. It's very common to have them locally and the best reason for that is that you can pin the version because maybe you're on like I'm on web pack 1.12 and they're about to release web pack 2 sometime in the near slash distant future, who knows.

[00:06:00] And now I can pin it to that version. It's definitely it’s gonna be that version. And I don't have to worry about people getting the wrong dependency version. Good question.
>> Speaker 5: Another question was when you run this is it running locally or globally, the standard?
>> Brian Holt: it's going to try and do it locally first.

[00:06:21] MPM's pretty smart about that. In fact, the later versions of. We can actually even just uninstall standard. Just, you don't have to do this. I'm just gonna show you. So I'm gonna unbuild it. So now if I try and run standard, it's gonna say, hey what the hell?

[00:06:40] But if I still do npm tests It's going to err, that's nice. Do I have it? I don't pry to have it as a dependency. So, npm install standard. So I'm now Jeez, what am I doing here? 403 forbidden. Sorry I have to switch registries. Use default. Okay let's try that again.

[00:07:21]
>> Brian Holt: Anyway this is all an elaborate way to show you that I'm calling standard as if I knew it was going to be on the command line but MPM is actually gonna be smart enough to look locally for that standard package before it looks like for a global version of it Okay so now if I say npm test it actually does find that correct standard binary it is.

[00:07:44] Despite the fact that if I type standard.
>> Brian Holt: It's not available globally I don't know I think it's a really cool feature. So I can still write my bashcommand the same way I don't have to do something dumb like Dot slash, node slash. Modules anyway. Neat feature. Okay any other questions.

[00:08:10]
>> Speaker 5: There was, can you run multiple modules in that test?
>> Brian Holt: Multiple modules?
>> Speaker 2: Multiple modules.
>> Brian Holt: Meaning I say like and and mocha, right?
>> Speaker 2: Yeah.
>> Brian Holt: Is that the idea? The answer's yes, and we'll do it here actually shortly. We just have nothing else to run right now.

[00:08:27] [LAUGH]