Vue native is always executing App.js instead of .vue

问题

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:

"Unable to resolve "../../App" from "node_modules\expo\AppEntry.js""

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

回答1:

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

回答2:

Had a same issue. Below works for me

In app.json add

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

Inside "packagerOpts"

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

Read it from: https://github.com/GeekyAnts/vue-native-core/issues/117

回答3:

If you are viewing on web browser(which isn't production ready), i think it will look for App entry file in this order js > json > vue. So i think it's impossible it will seek out App.vue.

For viewing on android phone, stop the Expo Dev Tools in terminal, delete App.js, then run npm start order or npm run android

来源：https://stackoverflow.com/questions/53806021/vue-native-is-always-executing-app-js-instead-of-vue

标签

javascript

Vue.js

vuejs2

vue-native