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

Question

我进行了 vue-native 安装的第一个过程，我正在遵循“入门”Hello world 教程（https://vue-native.io/getting-started.html），但App.vue从未执行过，只有App.js. _ 如果我删除App.js我得到一个错误：

“无法从“node_modules\expo\AppEntry.js”解析“../../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',
  },
});

应用程序.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>

谢谢

Answer 1

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

打开AppEntry.js文件。它应该如下所示：

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);

将 Appentry.js修改为：

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);

Answer 2

The following worked for me:
At first you delete app.js This will give you an error, but don't worry. You will have to run the npm install command. After this, run vue-native again with npm start

This will run the app.vue file normally

Answer 3

如果您在 Web 浏览器上查看（尚未准备好生产），我认为它会按 js > json > vue 的顺序查找 App 入口文件。所以我认为它不可能找到 App.vue。

在安卓手机上查看，在终端停止Expo Dev Tools，删除App.js，然后运行npm start order或npm run android

Answer 4

有同样的问题。下面对我有用

在 app.json 添加

"sourceExts": [ "js", "json", "ts", "tsx", "jsx", "vue"]

在“packagerOpts”里面

"packagerOpts": { "sourceExts": [ "js", "json", "ts", "tsx", "jsx", "vue"], "config": "metro.config.js"}

阅读自： https ://github.com/GeekyAnts/vue-native-core/issues/117