A layer is just like a regular Nuxt project, for more information on layers see: Nuxt Layers
Note: Ripple 2 packages are all hosted on Github Packages, any packages published to npm are either pre-release or deprecated, and should not be used! Please see the section Access to Github Packages repos for instructions on how to set up a personal access token, and where to use it.
Install all dependencies:
npm i
The .playground
directory should help you to develop your layer.
Set up a .env
file like this one under .playground
to change the backend API, site ID and search details.
cp .playground/example.env .playground/.env
To run dev mode in the .playground
directory, which imports your layer itself:
npm run dev
There may be a need to reuse some of the SDP core functionality from:
ripple-tide-landing-page
dynamic componentsripple-tide-webform
webform schema APIripple-ui-core
Ripple componentsripple-ui-forms
FormKit definitions and components
These are delivered through @dpc-sdp/ripple-sdp-core
and @dpc-sdp/nuxt-ripple
for convenience, but can also be added explicitly to the package.json
of this repo for use in your custom code. e.g.
dependencies: {
...
"@dpc-sdp/ripple-tide-landing-page": "v2.14.0",
...
}
To publish a release, prepare all changes in the main
branch.
Using the Github interface, Draft a new release. Under Choose a tag, then create a new tag using semver (typically the first release will be v0.1.0
), using Target: main.
Use the tag name as the release title (e.g. v0.1.0
).
Generate release notes can automatically write a changelog of PRs from the last release.
Make sure Set as the latest release is ticked then Publish release. A Github action will then publish the package on our org.
Add to the site app via package.json
e.g. (update package name and version where appropriate)
dependencies: {
...
"@dpc-sdp/ripple-lib-starter": "v0.1.0",
...
}
Finally, the site app will need to add this custom layer in its own nuxt.config.ts
e.g.
export default defineNuxtConfig({
// See https://nuxt.com/docs/getting-started/layers - please add custom layers after the //custom layers comment
extends: [
// Core layers
'@dpc-sdp/nuxt-ripple',
'@dpc-sdp/nuxt-ripple-analytics',
'@dpc-sdp/nuxt-ripple-preview',
'@dpc-sdp/ripple-sdp-core',
// Custom layers
'@dpc-sdp/ripple-lib-starter' // <-- update name
]
})