npm run dev 是「在本地運行我的網站」的標準，但它是如何運作的呢？我們如何擴充它的功能？在這篇文章中，我們將看看：
作為一個激勵範例，以下是凸幫助程式範例應用程式中定義的一些腳本。我們將介紹每個部分的作用
npm run 執行專案工作區中 package.json 中定義的指令。當您從 npm create vite@latest 等命令啟動儲存庫時，這些命令通常是預先配置的，其中的命令為：
這是來自 Next.js 的基本範例：
在這裡你可以運行 npm run dev 或 npm run lint 等
您可以在文件中了解有關 npm run 的更多資訊。
這是一個公平的問題，為什麼人們會將已經如此簡單的命令放入套件腳本中。為什麼不直接呼叫 jest 或 vite 或 next build 呢？有幾個很好的理由：
是的！即使您使用其他套件管理器安裝依賴項，您仍然可以使用 npm 運行套件腳本。
您不必記住 npm run dev 對應到yarn dev（或yarn run dev）。 npx 也是如此：無論您使用什麼套件管理器來安裝東西，npx 凸開發都可以運作。
有幾個套件可以用來同時執行指令：4
我們在這裡只看一下 npm-run-all 。考慮我們的例子：
這定義了三個腳本。
兩個輸出都會流出，執行 Ctrl-C 會中斷兩個腳本。
您可以透過將命令命名為 preX 或 postX 來指定在另一個命令（例如 X）之前（前）或之後（後）運行的命令。在範例中：
這將在 npm-run-all --parallel dev:backend dev:frontend 的「dev」指令之前執行凸開發 --until-success。
For those used to shell scripting, you can run two commands in sequence if the previous one succeeds with commandA && commandB. This works on both Windows and Unix (mac / linux).
However, there's a couple advantages to just using pre-scripts:
For Convex, when you first run npx convex dev (or npm run dev with the above scripts), it will ask you to log in if you aren't already, and ask you to set up your project if one isn't already set up. This is great, but interactive commands that update the output text don't work well when the output is being streamed by multiple commands at once. This is the motivation for running npx convex dev --until-success before npx convex dev.
If you change your "predev" command for Convex to include --run it will run a server-side function before your frontend has started.
"scripts": {
//...
"predev": "convex dev --until-success --run init",
//...
},
The --run init command will run a function that is the default export in convex/init.ts. You could also have run --run myFolder/myModule:myFunction. See docs on naming here. See this post on seeding data but the gist is that you can define an internalMutation that checks if the database is empty, and if so inserts a collection of records for testing / setup purposes.
If you use TypeScript, you can run a type check / compile your typescript files with a bare tsc. If your tsconfig.json is configured to emit types, it will write out the types. If not, it will just validate the types. This is great to do as part of the build, so you don't build anything that has type errors. This is why the above example did:
"build": "tsc && vite build",
If you want to pass arguments to a command, for instance passing arguments to your testing command to specify what test to run, you can pass them after a -- to separate the command from the argument. Technically you don't need -- if your arguments are positional instead of --prefixed, but it doesn't hurt to always do it in case you forget which to do it for.
npm run test -- --grep="pattern"
We looked at some ways of using package.json scripts to simplify our workflows. Who knew how much power could rest behind a simple npm run dev? Looking at our original example:
"scripts": {
"dev": "npm-run-all --parallel dev:backend dev:frontend",
"build": "tsc && vite build",
"dev:backend": "convex dev",
"dev:frontend": "vite",
"predev": "convex dev --until-success",
"test": "vitest"
},
The way your shell finds which command to run when you type npm is to check the shell's PATH environment variable (on unix machines anyways). You can see your own with echo "$PATH". It checks all the places specified in $PATH and uses the first one. ↩
Technically you can override & specify where npm installs binaries. ↩
如果你真的想，你可以直接執行 npm exec vitest，簡稱 npx vitest，./npm_modules/.bin/vitest，或是將 .npm_modules/.bin 加到你的 PATH 中。 ↩
有些人使用裸 & 在後台運行一項任務，但這在 Windows 上不受支持，並且中斷一個命令不一定會殺死另一個命令。 ↩
以上是使用 package.json 腳本增強'npm run dev”的詳細內容。更多資訊請關注PHP中文網其他相關文章！
