Vue
How to use Ripple components with Vue.
First, set up access to Github Packages.
Next, install Ripple UI in your project:
npm install @dpc-sdp/ripple-ui-core --save
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 or index.js file):
import '@dpc-sdp/ripple-ui-core/style';
import '@dpc-sdp/ripple-ui-core/style/components';
To use a component, import it from @dpc-sdp/ripple-ui-core/vue
, note the addition of /vue
.
<script setup>
import { RplButton } from '@dpc-sdp/ripple-ui-core/vue';
</script>
<template>
<RplButton variant="outlined" />
</template>
Please see this example app for a basic demonstration of how to use Ripple components in a Vue app.
Propose a change to this page on GitHub.