A simple dialogue to let you know what happened to npm run xxx
Q: Why do we start the project by typing npm run dev/serve when running the project?
Answer: This is so easy because there is a script corresponding to the configuration in the sctipt of package.json.
For example, if you type npm run dev, it actually executes webpack -cli-service serve
Q: Well, that’s not bad, so why execute npm run dev instead of directly executing vue-cli-service serve
Answer: (hesitating) Because it’s simple, renaming the command is easy and easy to write
Question: Do you want to stop thinking about it
? Answer: I don’t have a detailed understanding of this aspect (psychological construction: do I still need to understand this? I don’t need to understand it in my usual work. Why do I need to understand it?) Question: As an old
employee, how can I not know Then how do you bring new employees and apprentices in the future?
Answer: Uh... I smiled awkwardly, I was joking hahaha... I
went to ask my friends in private,... After a series of discussions, I finally figured out nice!!!
Answer: When we install dependencies, we execute them through npm i. For example, when npm i vue-cli-service installs dependencies, several executable files named vue-cli-service will be created in the node_modules/.bin/ directory. up.
When we execute npm run serve to execute vue-cli-service serve, although there is no global command to install vue-cli-service, npm will find vue-cli-service in the node_modules/.bin/ directory to execute as a script, which is equivalent to executing node_modules/.bin/vue-cli-service (serve is executed as a parameter)
Question: Okay, I understand. Where does the vue-cli-service script under node_modules/.bin/ come from? ? ?
Answer: The .bin directory under node_modules is not used to manage npm packages, but to indicate soft links one by one. Open the file and you can see #!/bin/sh at the top of the file, indicating that this is a script soft
link: similar to that in Windows "shortcut" for . Creating a soft link will create a new shortcut entry. For example, a soft link file b is created for file a, and file b will point to file a inside. When we read file b, the system will automatically lead to file a, and file b is the soft link of file a.
When we install a package, if the package is a command-line tool package, it must have the bin attribute, so there will be a corresponding configuration in the package.json file of the corresponding installation package. When npm install reads this configuration, npm
will This file is soft linked to the ./node_modules/.bin directory and node_modules/.bin will also be added to $PATH so that it can be used as a command to run dependent programs without having to install them globally
. , npm will help us configure this kind of soft connection. In fact, this kind of soft connection is equivalent to a mapping. When npm run xxx is executed, it will find the corresponding mapping file in node_modules/bin, and then find the corresponding js file to execute. I just checked that there are two vue-cli-service files in node_modules/bin. Why are there two files?
Answer: We generally use the vue-cli-service.cmd file script to run under the window as follows:
This script will use node to run vue-cli-service.js This file can use a series of system-related APIs in node, so you can do many things in this js, such as reading and analyzing the directory where this command is run files, generate files based on templates, etc.
# unix 系默认的可执行文件，必须输入完整文件名
vue-cli-service
# windows cmd 中默认的可执行文件，当我们不添加后缀名时，自动根据 pathext 查找文件
vue-cli-service.cmd
# Windows PowerShell 中可执行文件，可以跨平台
vue-cli-service.ps1
Q: The good answer is very detailed and I learned it
