时间戳

首页 > 解决方案 > 在 OnboardingScreens 上找不到 ID 为“kotlin-android”的插件

javascript - 在 OnboardingScreens 上找不到 ID 为“kotlin-android”的插件

问题描述

我是原生反应新手，并试图为应用程序创建一个入职屏幕。添加入职屏幕代码并将其导入 App.js 文件后。我试图运行该应用程序。

但是，该应用程序无法在我的模拟器上安装。

错误：

未找到 ID 为“kotlin-android”的插件。

尝试：使用 --stacktrace 选项运行以获取堆栈跟踪。使用 --info 或 --debug 选项运行以获得更多日志输出。运行 --scan 以获得完整的见解。

2：任务因异常而失败。

compileSdkVersion 未指定。请将其添加到 build.gradle

我的 build.gradle 文件如下所示：

// Top-level build file where you can add configuration options common to all sub-projects/modules.

buildscript {
    ext {
        buildToolsVersion = "29.0.2"
        minSdkVersion = 16
        compileSdkVersion = 29
        targetSdkVersion = 29
    }
    repositories {
        google()
        jcenter()
    }
    dependencies {
        classpath('com.android.tools.build:gradle:4.1.1')
        // NOTE: Do not place your application dependencies here; they belong
        // in the individual module build.gradle files
    }
}

allprojects {
    repositories {
        mavenLocal()
        maven {
            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
            url("$rootDir/../node_modules/react-native/android")
        }
        maven {
            // Android JSC is installed from npm
            url("$rootDir/../node_modules/jsc-android/dist")
        }

        google()
        jcenter()
        maven { url 'https://www.jitpack.io' }
    }
}

这是我的 App.js 文件

import React, { Component } from 'react';
import SplashScreen from 'react-native-splash-screen';
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';



//import Screens
import onboardingScreen from './screens/onboardingScreen';

import {
  Platform,
  StyleSheet,
  Text,
  View,
  StatusBar
} from 'react-native';

const AppStack = createStackNavigator();

export default class App extends Component {

  componentDidMount() {
    SplashScreen.hide()
  }
  render() {
    return (
      <NavigationContainer>
        <AppStack.Navigator
          headermode="none">

          <AppStack.Screen name="onboardingScreen" Component={onboardingScreen} />



        </AppStack.Navigator>
      </NavigationContainer>
    );
  }
}

包.json：

{
  "name": "Reactnative",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "start": "react-native start",
    "test": "jest",
    "lint": "eslint ."
  },
  "dependencies": {
    "@react-navigation/native": "^5.8.10",
    "@react-navigation/stack": "^5.12.8",
    "react": "16.13.1",
    "react-native": "0.63.4",
    "react-native-app-intro-slider": "^4.0.4",
    "react-native-navigation": "^7.6.0",
    "react-native-onboarding-swiper": "^1.1.4",
    "react-native-splash-screen": "^3.2.0",
    "react-navigation-stack": "^2.10.2"
  },
  "devDependencies": {
    "@babel/core": "^7.8.4",
    "@babel/runtime": "^7.8.4",
    "@react-native-community/eslint-config": "^1.1.0",
    "babel-jest": "^25.1.0",
    "eslint": "^6.5.1",
    "jest": "^25.1.0",
    "metro-react-native-babel-preset": "^0.59.0",
    "react-test-renderer": "16.13.1"
  },
  "jest": {
    "preset": "react-native"
  }
}

onboardingScreen.js：

import React from 'react';
import { view, Button, Text, Image, StyleSheet} from 'react-native';

import Onboarding from 'react-native-onboarding-swiper';


const Dots = ({selected}) => {
    let backgroundColor;

    backgroundColor = selected ? 'rgba(0, 0, 0, 0.8)' : 'rgba(0, 0, 0, 0.3)';

    return (
        <View 
            style={{
                width:6,
                height: 6,
                marginHorizontal: 3,
                backgroundColor
            }}
        />
    );
}

const Skip = ({...props}) => (
    <TouchableOpacity
        style={{marginHorizontal:10}}
        {...props}
    >
        <Text style={{fontSize:16}}>Skip</Text>
    </TouchableOpacity>
);

const Next = ({...props}) => (
    <TouchableOpacity
        style={{marginHorizontal:10}}
        {...props}
    >
        <Text style={{fontSize:16}}>Next</Text>
    </TouchableOpacity>
);

const Done = ({...props}) => (
    <TouchableOpacity
        style={{marginHorizontal:10}}
        {...props}
    >
        <Text style={{fontSize:16}}>Done</Text>
    </TouchableOpacity>
);



<Onboarding
   SkipButtonComponent={Skip}
        NextButtonComponent={Next}
        DoneButtonComponent={Done}
        DotComponent={Dots}
        onSkip={() => navigation.replace("Login")}
        onDone={() => navigation.navigate("Login")}
  pages={[
    {
      backgroundColor: '#fff',
      image: <Image source={require('../assets/img/slider1.png')} />,
      title: 'Enabling Collaboration',
      subtitle: 'We connect local shoppers to online buyers',
    },
      {
      backgroundColor: '#fff',
      image: <Image source={require('../assets/img/slider2.png')} />,
      title: 'Peer Up',
      subtitle: 'Going home? Ready to help? Drop Orders Get Compensated',
    },
      {
      backgroundColor: '#fff',
      image: <Image source={require('../assets/img/slider3.png')} />,
      title: 'Enabling Collaboration',
      subtitle: 'Busy at home? Need groceries quickly? Want low service fees 0% Mark-up as well? Just make a list',
    },
  ]}
/>

export default onboardingScreen;

const styles = StyleSheet.create({
  container: {
    flex: 1, 
    alignItems: 'center', 
    justifyContent: 'center'
  },
});

我也尝试用谷歌搜索错误，但找不到与 react-native-onboarding-swiper 相关的任何内容。

标签： javascriptandroidreactjsreact-nativekotlin

解决方案

我认为另一个库产生了错误。尝试这个

安卓/build.gradle

buildscript {
ext {
    minSdkVersion = 21 
    // kotlinVersion = "1.3.72" 
    kotlinVersion = "1.6.0"
}

dependencies {
    classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlinVersion" // add this line 
}
}

推荐阅读