This is SAP standard TODO web component sample Svelte application. In this repository, I've made several modifications to incorporate the latest version of Svelte, Vite and other related packages.
Additionally, there's a special souce to embed the Svelte TODO application within a UI5 application. This allows for seamless integration with on-premises launchpad or BTP Workzone, and you can use UI5 tooling for deployment.
Sample ToDo application that demonstrates the usage of UI5 Web Components using Svelte
The application showcases how to: bind properties, subscribe to and forward events, and consume UI5 Web Components within Svelte.
Project was initialized uising ViteJs and the svelte-ts tempalte
- Node.js version >=12.0.0.
- Clone this repository and navigate to the downloaded directory
git clone https://github.com/SAP-samples/ui5-webcomponents-sample-svelte.git cd ui5-webcomponents-sample-svelte
- Install all dependencies
npm install
- Start the local dev server and run the application
npm run dev
Create an issue in this repository if you find a bug or have questions about the content.
For additional support, ask a question in SAP Community.
-
Import the desired component(s) in your app to define the UI5 Web Component.
-
For example, to use
ui5-button
you need to import it:import "@ui5/webcomponents/dist/Button"; // loads ui5-button
Then, you can use the custom element in an HTML page:
<ui5-button>Hello world!</ui5-button>
Currently Chrome, Safari, Firefox and Edge (Chromium-based) support Web Components natively.
If you wish to contribute code, offer fixes or improvements, please send a pull request. Due to legal reasons, contributors will be asked to accept a DCO when they create the first pull request to this project. This happens in an automated fashion during the submission process. SAP uses the standard DCO text of the Linux Foundation.
Copyright (c) 2021 SAP SE or an SAP affiliate company. All rights reserved. This project is licensed under the Apache Software License, version 2.0 except as noted otherwise in the LICENSE file.