Using the JFrog Extension in VS Code
Last updated
Last updated
© 2024 JFrog Ltd All Rights Reserved
The extension offers two modes, Local and CI. The two modes can be toggled by pressing on their respective buttons that will appear next to the components tree.
The Local view displays information about the local code as it is being developed in VS Code. The developer can scan their local workspace continuously. The information is displayed in the Local view.
The CI view allows the tracking of the code as it is built, tested and scanned by the CI server. It displays information about the status of the build and includes a link to the build log on the CI server.
The icon demonstrates the top severity issue of a selected component and its transitive dependencies. The following table describes the severities from highest to lowest:
| Icon | Severity | Description |
|---|---|---|
Critical | Issue with critical severity | |
High | Issue with high severity | |
Medium | Issue with medium severity | |
Low | Issue with low severity | |
Unknown | Issue with unknown severity | |
Not Applicable | CVE issue that is not applicable to your source code | |
Normal | No issues (Used only in CI view) |
The JFrog VS Code Extension enables continuous scans of your project with the JFrog Platform. The security related information will be displayed under the Local view. It allows developers to view vulnerability information about their dependencies and source code in their IDE. With this information, you can make an informed decision on whether to use a component or not before it gets entrenched into the organization’s product.
scan your workspace by clicking the Scan/Rescan button, the icon at the extension tab or click on Start Xray Scan from within the editor. The scan will create a list of files with vulnerabilities in the workspace.
The CI view of the extension allows you to view information about your builds directly from your CI system. This allows developers to keep track of the status of their code, while it is being built, tested and scanned as part of the CI pipeline, regardless of the CI provider used.
This information can be viewed inside JFrog VS Code Extension, from the JFrog Panel, after switching to CI mode.
The following details can be made available in the CI view.
Status of the build run (passed or failed)
Build run start time
Git branch and latest commit message
Link to the CI run log
Security information about the build artifacts and dependencies
The CI information displayed in VS Code is pulled by the JFrog Extension directly from JFrog Artifactory. This information is stored in Artifactory as part of the build-info, which is published to Artifactory by the CI server.
Read more about build-info in the Build Integration documentation page. If the CI pipeline is also configured to scan the build-info by JFrog Xray, the JFrog VS Code Extension will pull the results of the scan from JFrog Xray and display them in the CI view as well.
Before VS Code can display information from your CI in the CI View, your CI pipeline needs to be configured to expose this data. Read this guide which describes how to configure your CI pipeline.
Set your CI build name in the Build name pattern field at the Extension Settings. This is the name of the build published to Artifactory by your CI pipeline. You have the option of setting * to view all the builds published to Artifactory.
After your builds were fetched from Artifactory, press on the Builds button to choose what build to display.
