JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 264
  • Score
    100M100P100Q94506F
  • License MIT

A high-performance React Native library for text-to-speech on iOS and Android

Package Exports

    This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@mhpdev/react-native-speech) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

    Readme

    react-native-speech

    A high-performance text-to-speech library built for bare React Native and Expo, compatible with Android and iOS. It enables seamless speech management and provides events for detailed synthesis management.


    Only New Architecture: This library is currently compatible with the new architecture. If you're using React Native 0.76 or higher, it is already enabled. However, if your React Native version is between 0.68 and 0.75, you need to enable it first. Click here if you need help enabling the new architecture

    Preview

    Android
    iOS

    Features

    • πŸš€ High-performance library created with Turbo Modules for both Android and iOS

    • πŸŽ›οΈ Provides essential and useful methods for full control over synthesis

    • 😎 Support for pause and resume, along with onResume and onPause events, for Android too. (If you have prior experience using text-to-speech, particularly on Android, note that unlike iOS, it doesn’t natively support these features, and this library handles them itself)

    • πŸ“‘ Offers useful events for more precise control over synthesis

    • βœ… Completely type-safe and written in TypeScript (on the React Native side)

    Installation

    Bare React Native

    Install the package using either npm or Yarn:

    npm install @mhpdev/react-native-speech

    Or with Yarn:

    yarn add @mhpdev/react-native-speech

    Expo

    For Expo projects, follow these steps:

    1. Install the package:

      npx expo install @mhpdev/react-native-speech
    2. Since it is not supported on Expo Go, run:

      npx expo prebuild

    Usage

    To learn how to use the library, check out the usage section.

    Quick Start

    import React from 'react';
    import Speech from '@mhpdev/react-native-speech';
    import {SafeAreaView, StyleSheet, Text, TouchableOpacity} from 'react-native';
    
    const App: React.FC = () => {
      const onSpeakPress = () => {
        Speech.speak('Hello World!');
      };
    
      return (
        <SafeAreaView style={styles.container}>
          <TouchableOpacity style={styles.button} onPress={onSpeakPress}>
            <Text style={styles.buttonText}>Speak</Text>
          </TouchableOpacity>
        </SafeAreaView>
      );
    };
    
    export default App;
    
    const styles = StyleSheet.create({
      container: {
        flex: 1,
        alignItems: 'center',
        justifyContent: 'center',
      },
      button: {
        padding: 12.5,
        borderRadius: 5,
        backgroundColor: 'skyblue',
      },
      buttonText: {
        fontSize: 22,
        fontWeight: '600',
      },
    });

    To become more familiar with the usage of the library, check out the example project.

    Contributing

    See the contributing guide to learn how to contribute to the repository and the development workflow.

    License

    MIT