Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/dreambo8563/vue-device-detector

A tiny device detector plugin of Vue for mobile🐔👁
https://github.com/dreambo8563/vue-device-detector

device-detection mobile typescript useragent vue

Last synced: 10 days ago
JSON representation

A tiny device detector plugin of Vue for mobile🐔👁

Host: GitHub
URL: https://github.com/dreambo8563/vue-device-detector
Owner: dreambo8563
License: mit
Created: 2019-03-08T05:18:52.000Z (over 5 years ago)
Default Branch: master
Last Pushed: 2023-01-03T17:30:10.000Z (almost 2 years ago)
Last Synced: 2024-10-06T20:05:50.754Z (about 1 month ago)
Topics: device-detection, mobile, typescript, useragent, vue
Language: TypeScript
Homepage:
Size: 5.32 MB
Stars: 46
Watchers: 4
Forks: 12
Open Issues: 41
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md

Awesome Lists containing this project

README

        [![Codacy Badge](https://api.codacy.com/project/badge/Grade/38f22883688b438db21d672e1d4d3daf)](https://www.codacy.com/app/dreambo8563/vue-DeviceDetector?utm_source=github.com&utm_medium=referral&utm_content=dreambo8563/vue-DeviceDetector&utm_campaign=Badge_Grade)

[![All Contributors](https://img.shields.io/badge/all_contributors-1-orange.svg?style=flat-square)](#contributors)

[![Build Status](https://travis-ci.com/dreambo8563/vue-DeviceDetector.svg?branch=master)](https://travis-ci.com/dreambo8563/vue-DeviceDetector)

[![Greenkeeper badge](https://badges.greenkeeper.io/dreambo8563/vue-DeviceDetector.svg)](https://greenkeeper.io/)

[![Known Vulnerabilities](https://snyk.io/test/github/dreambo8563/vue-DeviceDetector/badge.svg?targetFile=package.json)](https://snyk.io/test/github/dreambo8563/vue-DeviceDetector?targetFile=package.json)

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)

![npm type definitions](https://img.shields.io/npm/types/vue-device-detector.svg?style=flat)

![npm](https://img.shields.io/npm/dt/vue-device-detector.svg?style=flat)

[![FOSSA Status](https://app.fossa.io/api/projects/git%2Bgithub.com%2Fdreambo8563%2Fvue-DeviceDetector.svg?type=shield)](https://app.fossa.io/projects/git%2Bgithub.com%2Fdreambo8563%2Fvue-DeviceDetector?ref=badge_shield)

# vue-device-detector ([for Vue 3](https://github.com/dreambo8563/next-vue-device-detector))

![](https://raw.githubusercontent.com/dreambo8563/static-assets/master/watcher2.png)

**vue-device-detector** is a simple vue plugin to inspect the device type.

- focus on mobile

- vue friendly

- strong typed

TODO:

- [x] add dingding api

- [x] add weixin api

### Install

```cmd

npm install vue-device-detector --save

```

### Quick Start

```js

import device from "vue-device-detector"

Vue.use(device)

```

### Methods

- this.\$device in Component context.

- Vue.\$device in global.

### API list

you can get the following properties under this.\$device

```ts

interface IDeviceDetector {

  ios: Boolean

  iphone: Boolean

  iphoneX: Boolean

  iPhoneXR: Boolean

  iPhoneXSMax: Boolean

  ipod: Boolean

  ipad: Boolean

  android: Boolean

  androidPhone: Boolean

  windows: Boolean

  mobile: Boolean

  dingding: Boolean //钉钉

  wechat: Boolean, // 微信

  wechatMiniApp: Boolean //微信小程序

}

```

eg.

on iphoneX

```js

console.log(this.$device.iphoneX) // true

console.log(this.$device.ios) // true

console.log(this.$device.android) // false

```

## License

[![FOSSA Status](https://app.fossa.io/api/projects/git%2Bgithub.com%2Fdreambo8563%2Fvue-DeviceDetector.svg?type=large)](https://app.fossa.io/projects/git%2Bgithub.com%2Fdreambo8563%2Fvue-DeviceDetector?ref=badge_large)

## Contributors

Thanks goes to these wonderful people ([emoji key](https://github.com/all-contributors/all-contributors#emoji-key)):

| [
_{Vincent Guo}](https://dreambo8563.github.io/)
[💻](https://github.com/dreambo8563/vue-DeviceDetector/commits?author=dreambo8563 "Code") [📖](https://github.com/dreambo8563/vue-DeviceDetector/commits?author=dreambo8563 "Documentation") [🚇](#infra-dreambo8563 "Infrastructure (Hosting, Build-Tools, etc)") |

| :---: |

This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!