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 !
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.