shacl-vue

Build configuration ​

shacl-vue supports the use of build-time configuration options that are supplied either directly as ENV variables or via a config file, for example:

BUILD_GIT_COMMIT="$(shell git rev-parse HEAD)" npm run build:app

or

BUILD_CONFIG='path/to/config/file.yaml' npm run build:app

The latter allows the specification of config options at build time via a path to a JSON or YAML file, using the BUILD_CONFIG environment variable. The file is read by Vite at build time and injected into environment variables that are made accessible to the rest of the application in the standard Vite approach, i.e. via import.meta.env.VITE_MY_VARIABLE in Javascript/VueJS files and %VITE_MY_VARIABLE% in HTML. Note that variables specified via such a build config file are not required to have the VITE_ prefix.

Currently supported build variables are described below in sections:

Build environment details ​

BUILD_CONFIG ​

A path to a build-environment-local JSON or YAML file that contains build configuration variables.

BUILD_GIT_* ​

For easier status checks and debugging, shacl-vue UI can display the specifics of a git repository used during the build process. This is shown in the Settings dialog, for example:

alt

To allow this, four environment variables should be accessible to the build process:

  • BUILD_GIT_COMMIT: The git commit hash of the git repository when the UI was built
  • BUILD_GIT_COMMIT_SHORT: The short version of the commit hash of the git repository when the UI was built
  • BUILD_GIT_BRANCH: The branch of the git repository used during the build
  • BUILD_GIT_DATE: The datetime snapshot at build time

This can be done dynamically at build time, e.g.:

sh
BUILD_GIT_COMMIT="$(shell git rev-parse HEAD)" \
BUILD_GIT_COMMIT_SHORT="$(shell git rev-parse --short HEAD)" \
BUILD_GIT_BRANCH="$(shell git rev-parse --abbrev-ref HEAD)" \
BUILD_GIT_DATE="$(shell git show -s --format=%cI HEAD)" npm run build:app

Build outputs ​

VITE_OUT_DIR ​

A local path can be provided to specify where the build output files should be saved.

UI specifications ​

VITE_SHACLVUE_VARIANT ​

This can be used to specify of the default or starter variant of the UI should be build. See the shacl-vue Kickstarter variant section for more information.

Security specifications ​

Some browser-side security features of shacl-vue can be configured via build config options, including:

  • DOMPURIFY
  • CSP_CONTENT
  • FETCH

See the Security features section for a detailed specification.