Docs›Autocomplete for npm scripts
Building Autocomplete for package.json
Scripts
Add autocomplete to any Node.js project by simply including a fig
object in the project's package.json
file.
This tutorial will walk through how to add a completion spec into your package.json
.
Why add autocomplete to package.json scripts?
Node projects typically contain multiple scripts that are defined in the package.json
. For example, a typical React app will have a test
script, a build
script, and a command to run the built project.
This setup would look like this in your package.json
.
"scripts": {
"test": "react-scripts test",
"build": "react-scripts build",
"start": "react-scripts start"
},
Adding autocomplete serves as a lightweight way to document the npm
scripts in your project, both for yourself and for any teammates that have Fig installed.
By default, Fig automatically generates autocomplete suggestions based on elements in the "scripts"
object of the package.json
. Adding a fig
object will override this but will give you more power to customize the output.
Adding the Fig Object
Add a separate JSON object with "fig"
as its key. Under this object, we nest JSON objects, with their keys being the names of your scripts.
You can include a description, icon, and custom priority property to each script item.
{
"name": "react-app",
"version": "1.0.0",
"description": "My awesome react app",
"scripts": {
"test": "react-scripts test",
"build": "react-scripts build",
"start": "react-scripts start"
},
"fig": {
"test": {
"description": "Run all tests",
"icon": "🧪",
"priority": 100
},
"build": {
"description": "Build the project",
"icon": "🛠"
},
"start": {
"description": "Start the react app",
"icon": "⭐️"
}
}
...
}
Here is how it looks when you type npm run
in the withfig/autocomplete repo
Note that suggestions in the Fig object will only show up if a script with the same name is found under the "scripts"
object.
Now, when anyone in the project's directory types npm run
or yarn run
into their terminal, Fig will present a Suggestion object for each script that is defined.