Svelte Device Detector
Render views on different device types
Svelte Device Detector
Render views on different device types.
Installation
npm i svelte-device-detector
// OR
yarn add svelte-device-detector
Note: to use this library in sapper, install as devDependency. See the link.
Demo
Local demo:
git clone https://github.com/andrelmlins/svelte-device-detector.git
cd svelte-device-detector
npm install && npm run dev
Examples
An example of how to use the library:
<script>
import DeviceDetector from "svelte-device-detector";
</script>
<DeviceDetector showInDevice="desktop">
<p>Desktop</p>
</DeviceDetector>
<DeviceDetector showInBrowser="chrome" showInDevice="mobile">
<p>Mobile and Chrome</p>
</DeviceDetector>
<DeviceDetector showInBrowser={["safari", "firefox"]}>
<p>Safari or Firefox</p>
</DeviceDetector>
Properties
For best results the values have these characteristics:
- Ignores sensitive case
- Ignore special character
- Removing accents
- Skips space
| Prop | Default | Type | Description |
|---|---|---|---|
| showInDevice | - | string, array |
Render view on device types |
| showInBrowser | - | string, array |
Render view on browser types |
| showInOs | - | string, array |
Render view on operational system types |
NPM Statistics
Download stats for this NPM package
License
Svelte Device Detector is open source software licensed as MIT.
