Vue-native Module not found: Can't resolve '../../App'

902 views Asked by At

I try to start vue-native.

$npm install -g vue-native-cli expo-cli

in my project, I installed

$ npm install vue-native-core vue-native-helper --save
$ npm install vue-native-scripts --save-dev

I create vueTransformerPlugin.js and metro.config.js like the guide line told me [https://vue-native.io/docs/installation.html][1]

When I start the projet, I have this isssue

$ npm run web

web Failed to compile. //vueexpocli/node_modules/expo/AppEntry.js Module not found: Can't resolve '../../App' in '//vueexpocli/node_modules/expo'

I have looked at a lot of forum

// app.json
        {
      "expo": {
        "name": "vueexpocli",
        "slug": "vueexpocli",
        "version": "1.0.0",
        "orientation": "portrait",
        "icon": "./assets/icon.png",
        "splash": {
          "image": "./assets/splash.png",
          "resizeMode": "contain",
          "backgroundColor": "#ffffff"
        },
        "updates": {
          "fallbackToCacheTimeout": 0
        },
        "assetBundlePatterns": [
          "**/*"
        ],
        "ios": {
          "supportsTablet": true
        },
        "web": {
          "favicon": "./assets/favicon.png"
        },
        "packagerOpts": {
          "config": "metro.config.js",
          "sourceExts": [
            "vue",
            "js",
            "json",
            "ts",
            "tsx"
          ]
        }
      }
    }
//package.json
    {
      "main": "node_modules/expo/AppEntry.js",
      "scripts": {
        "start": "expo start",
        "android": "expo start --android",
        "ios": "expo start --ios",
        "web": "expo start --web",
        "eject": "expo eject",
        "lint": "eslint ./src ./App.vue --ext .js,.vue",
        "lint:fix": "eslint ./src ./App.vue --ext .js,.vue --fix"
      },
      "dependencies": {
        "expo": "~38.0.8",
        "expo-status-bar": "^1.0.2",
        "react": "~16.11.0",
        "react-dom": "~16.11.0",
        "react-native": "https://github.com/expo/react-native/archive/sdk-38.0.2.tar.gz",
        "react-native-web": "~0.11.7",
        "vue-native-core": "^0.1.4",
        "vue-native-helper": "^0.1.4",
        "vue-native-router": "~0.1.1"
      },
      "devDependencies": {
        "babel-eslint": "^10.0.3",
        "eslint": "^6.5.1",
        "eslint-config-prettier": "^6.4.0",
        "eslint-plugin-prettier": "^3.1.1",
        "eslint-plugin-react": "^7.16.0",
        "eslint-plugin-vue": "^5.2.3",
        "jest-expo": "^35.0.0",
        "prettier": "^1.18.2",
        "react-test-renderer": "16.8.6",
        "vue-native-scripts": "~0.1.4"
      },
      "private": true
    }

I renamed App.js to App.vue and change

// 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>

Do you have any ideas ? I see a lot of forum. I tried to rename in AppEntry.js App to App.vue but I have an issue as well.

Please, Please, Help me !

1

There are 1 answers

0
ThePianoDentist On

I believe (as of this post) vue-native web mode is currently broken https://github.com/GeekyAnts/vue-native-core/issues/268

(https://github.com/GeekyAnts/vue-native-core/issues/235 for specific error message)

Issue has been open a while, so hopefully gets fixed in 2021 :D

For now have to just test/run as android/ios rather than web.