Vue native 总是执行 App.js 而不是 .vue

问题描述

我做了安装vue-native的第一个过程，我正在关注入门"Hello world教程(

App.js

从'react'导入React；import { StyleSheet, Text, View } from 'react-native';导出默认类 App 扩展 React.Component {使成为() {返回 (<视图样式={styles.container}><Text>打开 App.js 以开始处理您的应用！</Text></查看>);}}const 样式 = StyleSheet.create({容器: {弹性:1，背景颜色:'#fff'，alignItems: '中心',justifyContent: '中心',},});

App.vue

<view class="容器"><text class="text-color-primary">我的 Vue 原生应用</text></查看></模板><风格>.容器 {背景颜色:白色；对齐项目:居中；对齐内容:居中；弹性:1；}.text-color-primary {颜色:蓝色；}</风格>

谢谢

解决方案

尽管答案可能适用于某些人.还有另一种方法可以在不删除任何文件的情况下解决此问题.导航到节点模块文件夹.搜索 expo 文件夹.

打开 AppEntry.js 文件.它应该是这样的:

import 'expo/build/Expo.fx';从 'expo/build/launch/registerRootComponent' 导入 registerRootComponent；导入 { activateKeepAwake } from 'expo-keep-awake';从'../../App'导入应用程序；//我们会改变这个！如果(__DEV__){activateKeepAwake();}registerRootComponent(App);

将 Appentry.js 修改为:

import 'expo/build/Expo.fx';从 'expo/build/launch/registerRootComponent' 导入 registerRootComponent；导入 { activateKeepAwake } from 'expo-keep-awake';从'../../App.vue'导入应用程序；//将使用 App.vue 作为入口点如果(__DEV__){activateKeepAwake();}registerRootComponent(App);

I made the first process of installation of vue-native, and I'm following the "Getting Started" Hello world tutorial (https://vue-native.io/getting-started.html), but the App.vue is never executed, only the App.js. If I remove the App.js I get an error:

How can I fix this problem to make it work and follow the tutorial with any problem?

Folder Structure:

App.js

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

export default class App extends React.Component {
  render() {
    return (
      <View style={styles.container}>
        <Text>Open up App.js to start working on your app!</Text>
      </View>
    );
  }
}

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

App.vue

<template>
  <view class="container">
    <text class="text-color-primary">My Vue Native App</text>
    </view>
</template>

<style>
.container {
  background-color: white;
  align-items: center;
  justify-content: center;
  flex: 1;
}
.text-color-primary {
  color: blue;
}
</style>

Thank you

解决方案

Although the answers might work for some. There is another way to fix this issue without deleting any files.Navigate to the node modules folder.Search for the expo folder.

Open the AppEntry.js file.It should look like this:

import 'expo/build/Expo.fx';
import registerRootComponent from 'expo/build/launch/registerRootComponent';
import { activateKeepAwake } from 'expo-keep-awake';

import App from '../../App'; // we will change this!

if (__DEV__) {
  activateKeepAwake();
}

registerRootComponent(App);

Modify Appentry.js to this:

import 'expo/build/Expo.fx';
import registerRootComponent from 'expo/build/launch/registerRootComponent';
import { activateKeepAwake } from 'expo-keep-awake';

import App from '../../App.vue'; // Will use App.vue as the entry point

if (__DEV__) {
  activateKeepAwake();
}

registerRootComponent(App);

这篇关于Vue native 总是执行 App.js 而不是 .vue的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！