Nuxt
How to use Ripple components with Nuxt in a non-SDP context.
First, set up access to Github Packages.
Next, install Ripple UI in your project:
npm install @dpc-sdp/ripple-ui-core --save
Ripple UI exports a nuxt module that you can add to your nuxt config, note the addition of /nuxt:
export default defineNuxtConfig({
modules: [
'@dpc-sdp/ripple-ui-core/nuxt'
]
})
In order for the styles to appear correctly, you will need to import them. Do this at the root of your project (usually in your app.vue file):
import '@dpc-sdp/ripple-ui-core/style';
import '@dpc-sdp/ripple-ui-core/style/components';
There is no need to import the components as they will be registered globally by the nuxt module
<template>
<RplButton variant="outlined" />
</template>
#Using in an SDP website
If you are using Ripple 2 to build a site on the SDP platform, the UI libraries will be included automatically when scaffolding your project.
For documentation on using Ripple with Nuxt in SDP sites, visit the support for SDP developers
Propose a change to this page on GitHub.