mirror of
https://github.com/danielsogl/awesome-cordova-plugins.git
synced 2025-01-31 10:36:14 +08:00
docs(readme): adjust links
This commit is contained in:
Daniel Sogl
parent
740717fc8a
commit
9ecf431348
52
README.md
52
README.md
@ -1,30 +1,30 @@
|
||||
[](http://commitizen.github.io/cz-cli/) 
|
||||
[](http://commitizen.github.io/cz-cli/) 
|
||||
|
||||
# Cordova Awesome Plugins
|
||||
# Awesome Cordova Plugins
|
||||
|
||||
Cordova Awesome Plugins is a curated set of wrappers for Cordova plugins that make adding any native functionality you need to your [Ionic](https://ionicframework.com/) mobile app easy.
|
||||
Awesome Cordova Plugins is a curated set of wrappers for Cordova plugins that make adding any native functionality you need to your [Ionic](https://ionicframework.com/) mobile app easy.
|
||||
|
||||
Cordova Awesome Plugins wraps plugin callbacks in a Promise or Observable, providing a common interface for all plugins and making it easy to use plugins with Angular change detection.
|
||||
Awesome Cordova Plugins wraps plugin callbacks in a Promise or Observable, providing a common interface for all plugins and making it easy to use plugins with Angular change detection.
|
||||
|
||||
To learn more about the reasons why Ionic Native was renamed to Awesome Cordova Plugins, read the official [Ionic blog](https://ionicframework.com/blog/a-new-chapter-for-ionic-native/) post by Max Lyncht.
|
||||
|
||||
## Capacitor Support
|
||||
|
||||
In addition to Cordova, Cordova Awesome Plugins also works with [Capacitor](https://capacitor.ionicframework.com), Ionic's official native runtime. Basic usage below. For complete details, [see the Capacitor documentation](https://capacitor.ionicframework.com/docs/cordova/using-cordova-plugins).
|
||||
In addition to Cordova, Awesome Cordova Plugins also works with [Capacitor](https://capacitor.ionicframework.com), Ionic's official native runtime. Basic usage below. For complete details, [see the Capacitor documentation](https://capacitor.ionicframework.com/docs/cordova/using-cordova-plugins).
|
||||
|
||||
## Installation
|
||||
|
||||
Run following command to install Cordova Awesome Plugins in your project.
|
||||
Run following command to install Awesome Cordova Plugins in your project.
|
||||
|
||||
```bash
|
||||
npm install @cordova-awesome-plugins/core --save
|
||||
npm install @awesome-cordova-plugins/core --save
|
||||
```
|
||||
|
||||
You also need to install the Cordova Awesome Plugins package for each plugin you want to add. Please see the [Cordova Awesome Plugins documentation](https://ionicframework.com/docs/native/) for complete instructions on how to add and use the plugins.
|
||||
You also need to install the Awesome Cordova Plugins package for each plugin you want to add. Please see the [Awesome Cordova Plugins documentation](https://ionicframework.com/docs/native/) for complete instructions on how to add and use the plugins.
|
||||
|
||||
## Documentation
|
||||
|
||||
For the full Cordova Awesome Plugins documentation, please visit [https://ionicframework.com/docs/native/](https://ionicframework.com/docs/native/).
|
||||
For the full Awesome Cordova Plugins documentation, please visit [https://ionicframework.com/docs/native/](https://ionicframework.com/docs/native/).
|
||||
|
||||
### Basic Usage
|
||||
|
||||
@ -35,7 +35,7 @@ Make sure to import the injectable class from the `/ngx` directory as shown in t
|
||||
|
||||
```typescript
|
||||
// app.module.ts
|
||||
import { Camera } from '@cordova-awesome-plugins/camera/ngx';
|
||||
import { Camera } from '@awesome-cordova-plugins/camera/ngx';
|
||||
|
||||
...
|
||||
|
||||
@ -53,7 +53,7 @@ export class AppModule { }
|
||||
```
|
||||
|
||||
```typescript
|
||||
import { Geolocation } from '@cordova-awesome-plugins/geolocation/ngx';
|
||||
import { Geolocation } from '@awesome-cordova-plugins/geolocation/ngx';
|
||||
import { Platform } from 'ionic-angular';
|
||||
|
||||
@Component({ ... })
|
||||
@ -85,14 +85,14 @@ export class MyComponent {
|
||||
|
||||
#### Ionic/React apps
|
||||
|
||||
React apps must use Capacitor to build native mobile apps. However, Cordova Awesome Plugins (and therefore, Cordova plugins) can still be used.
|
||||
React apps must use Capacitor to build native mobile apps. However, Awesome Cordova Plugins (and therefore, Cordova plugins) can still be used.
|
||||
|
||||
```bash
|
||||
# Install Core library (once per project)
|
||||
npm install @cordova-awesome-plugins/core
|
||||
npm install @awesome-cordova-plugins/core
|
||||
|
||||
# Install Cordova Awesome Plugins TypeScript wrapper
|
||||
npm install @cordova-awesome-plugins/barcode-scanner
|
||||
# Install Awesome Cordova Plugins TypeScript wrapper
|
||||
npm install @awesome-cordova-plugins/barcode-scanner
|
||||
|
||||
# Install Cordova plugin
|
||||
npm install phonegap-plugin-barcodescanner
|
||||
@ -104,7 +104,7 @@ ionic cap sync
|
||||
Import the plugin object then use its static methods:
|
||||
|
||||
```typescript
|
||||
import { BarcodeScanner } from '@cordova-awesome-plugins/barcode-scanner';
|
||||
import { BarcodeScanner } from '@awesome-cordova-plugins/barcode-scanner';
|
||||
|
||||
const Tab1: React.FC = () => {
|
||||
const openScanner = async () => {
|
||||
@ -131,7 +131,7 @@ const Tab1: React.FC = () => {
|
||||
These modules can work in any ES2015+/TypeScript app (including Angular/Ionic apps). To use any plugin, import the class from the appropriate package, and use it's static methods.
|
||||
|
||||
```js
|
||||
import { Camera } from '@cordova-awesome-plugins/camera';
|
||||
import { Camera } from '@awesome-cordova-plugins/camera';
|
||||
|
||||
document.addEventListener('deviceready', () => {
|
||||
Camera.getPicture()
|
||||
@ -142,9 +142,9 @@ document.addEventListener('deviceready', () => {
|
||||
|
||||
#### AngularJS
|
||||
|
||||
Cordova Awesome Plugins generates an AngularJS module in runtime and prepares a service for each plugin. To use the plugins in your AngularJS app:
|
||||
Awesome Cordova Plugins generates an AngularJS module in runtime and prepares a service for each plugin. To use the plugins in your AngularJS app:
|
||||
|
||||
1. Download the latest bundle from the [Github releases](https://github.com/danielsogl/cordova-awesome-plugins/releases) page.
|
||||
1. Download the latest bundle from the [Github releases](https://github.com/danielsogl/awesome-cordova-plugins/releases) page.
|
||||
2. Include it in `index.html` before your app's code.
|
||||
3. Inject `ionic.native` module in your app.
|
||||
4. Inject any plugin you would like to use with a `$cordova` prefix.
|
||||
@ -164,9 +164,9 @@ angular.module('myApp', ['ionic.native']).controller('MyPageController', functio
|
||||
|
||||
#### Vanilla JS
|
||||
|
||||
To use Cordova Awesome Plugins in any other setup:
|
||||
To use Awesome Cordova Plugins in any other setup:
|
||||
|
||||
1. Download the latest bundle from the [Github releases](https://github.com/danielsogl/cordova-awesome-plugins/releases) page.
|
||||
1. Download the latest bundle from the [Github releases](https://github.com/danielsogl/awesome-cordova-plugins/releases) page.
|
||||
2. Include it in `index.html` before your app's code.
|
||||
3. Access any plugin using the global `IonicNative` variable.
|
||||
|
||||
@ -185,14 +185,14 @@ document.addEventListener('deviceready', function () {
|
||||
|
||||
### Mocking and Browser Development (Ionic/Angular apps only)
|
||||
|
||||
Cordova Awesome Plugins makes it possible to mock plugins and develop nearly the entirety of your app in the browser or in `ionic serve`.
|
||||
Awesome Cordova Plugins makes it possible to mock plugins and develop nearly the entirety of your app in the browser or in `ionic serve`.
|
||||
|
||||
To do this, you need to provide a mock implementation of the plugins you wish to use. Here's an example of mocking the `Camera` plugin to return a stock image while in development:
|
||||
|
||||
First import the `Camera` class in your `src/app/app.module.ts` file:
|
||||
|
||||
```typescript
|
||||
import { Camera } from '@cordova-awesome-plugins/camera/ngx';
|
||||
import { Camera } from '@awesome-cordova-plugins/camera/ngx';
|
||||
```
|
||||
|
||||
Then create a new class that extends the `Camera` class with a mock implementation:
|
||||
@ -222,7 +222,7 @@ import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular';
|
||||
import { MyApp } from './app.component';
|
||||
import { HomePage } from '../pages/home/home';
|
||||
|
||||
import { Camera } from '@cordova-awesome-plugins/camera/ngx';
|
||||
import { Camera } from '@awesome-cordova-plugins/camera/ngx';
|
||||
|
||||
import { HomePage } from '../pages/home/home';
|
||||
import { MyApp } from './app.component';
|
||||
@ -250,13 +250,13 @@ export class AppModule {}
|
||||
|
||||
### Runtime Diagnostics
|
||||
|
||||
Spent way too long diagnosing an issue only to realize a plugin wasn't firing or installed? Cordova Awesome Plugins lets you know what the issue is and how you can resolve it.
|
||||
Spent way too long diagnosing an issue only to realize a plugin wasn't firing or installed? Awesome Cordova Plugins lets you know what the issue is and how you can resolve it.
|
||||
|
||||
|
||||
|
||||
## Plugin Missing?
|
||||
|
||||
Let us know or submit a PR! Take a look at [the Developer Guide](https://github.com/danielsogl/cordova-awesome-plugins/blob/master/DEVELOPER.md) for more on how to contribute. :heart:
|
||||
Let us know or submit a PR! Take a look at [the Developer Guide](https://github.com/danielsogl/awesome-cordova-plugins/blob/master/DEVELOPER.md) for more on how to contribute. :heart:
|
||||
|
||||
# Credits
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user