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.
Related
Since my last update, my build .apk app is not working anymore on Android. On emulator, the app is working properly but when i open it on phone, it's crash instantly.
package.json :
"name": "xxx",
"version": "0.9.0",
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web"
},
"dependencies": {
"#react-navigation/bottom-tabs": "^6.4.0",
"#react-navigation/native": "^6.0.13",
"#react-navigation/native-stack": "^6.9.0",
"axios": "^0.27.2",
"expo": "~46.0.13",
"expo-secure-store": "~11.3.0",
"expo-splash-screen": "~0.16.2",
"expo-status-bar": "~1.4.0",
"expo-updates": "^0.14.6",
"react": "18.0.0",
"react-native": "0.69.6",
"react-native-reanimated": "~2.9.1",
"react-native-safe-area-context": "^4.3.1",
"react-native-screens": "~3.15.0"
},
"devDependencies": {
"#babel/core": "^7.12.9"
},
"private": true
}
app.json :
"expo": {
"name": "name",
"slug": "name",
"version": "0.9.0",
"orientation": "portrait",
"icon": "./src/assets/icon_android.png",
"userInterfaceStyle": "light",
"splash": {
"image": "./src/assets/splash.png",
"resizeMode": "contain",
"backgroundColor": "#fff"
},
"updates": {
"fallbackToCacheTimeout": 0
},
"assetBundlePatterns": [
"**/*"
],
"ios": {
"supportsTablet": true
},
"android": {
"adaptiveIcon": {
"foregroundImage": "./src/assets/icon_android.png",
"backgroundColor": "#FFFFFF"
},
"package": "xx.xxx.xx"
},
"web": {
"favicon": "./src/assets/favicon.png"
},
"extra": {
"eas": {
"projectId": "myid"
}
}
}
}
Thank you to everyone who will help me! from what i could see on similar problems, it could come from the packages
I ended up starting from an old save which allowed me to isolate the problem:
it seems that the expo-updates package crashes the app if present in package.json
How to fix this error i am using expo react native
ERROR Invariant Violation: ViewPropTypes has been removed from React Native. Migrate to ViewPropTypes exported from 'deprecated-react-native-prop-types'. this is the errors pls also check my code i have provided
My 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"
},
"dependencies": {
"#react-native-community/masked-view": "0.1.10",
"#react-navigation/bottom-tabs": "^5.11.10",
"#react-navigation/compat": "^5.3.20",
"#react-navigation/native": "^5.9.4",
"#react-navigation/stack": "^5.14.4",
"expo": "^46.0.0",
"expo-av": "~12.0.4",
"expo-linear-gradient": "~11.4.0",
"expo-status-bar": "~1.4.0",
"haversine": "^1.1.1",
"react": "18.0.0",
"react-dom": "18.0.0",
"react-native": "0.69.5",
"react-native-animatable": "^1.3.3",
"react-native-flexi-radio-button": "^0.2.2",
"react-native-fontawesome": "^7.0.0",
"react-native-gesture-handler": "~2.5.0",
"react-native-modal": "^13.0.0",
"react-native-modalize": "^2.0.8",
"react-native-progress-circle": "^2.1.0",
"react-native-reanimated": "~2.9.1",
"react-native-safe-area-context": "4.3.1",
"react-native-screens": "~3.15.0",
"react-native-snap-carousel": "^3.9.1",
"react-native-swiper": "^1.6.0",
"react-native-web": "~0.18.7",
"react-navigation": "^4.4.4",
"rn-sliding-up-panel": "^2.4.5"
},
"devDependencies": {
"#babel/core": "^7.18.6"
},
"private": true
}
my app.json
{
"expo": {
"name": "amdy-edu",
"slug": "amdy-edu",
"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
},
"android": {
"adaptiveIcon": {
"foregroundImage": "./assets/adaptive-icon.png",
"backgroundColor": "#FFFFFF"
}
},
"web": {
"favicon": "./assets/favicon.png"
}
}
}
my babel.config.js
module.exports = function(api) {
api.cache(true);
return {
presets: ['module:metro-react-native-babel-preset'],
plugins: ['react-native-reanimated/plugin'],
};
};
This helped me solve the same issue, Use this instead.
npm i git+https://github.com/LarvenLLC/react-native-snap-carousel.git
Reference: https://github.com/meliorence/react-native-snap-carousel/pull/929#issuecomment-1221294797
The correct fix here is to switch to deprecated-react-native-prop-types or a type system like Typescript.
The problem lies in react-native-snap-carousel. You have 2 choices. You either find an alternative or you navigate to node_modules/react-native-snap-carousel and change all imports to deprecated types.
I have a nodejs typescript project cloned from https://github.com/microsoft/BotBuilder-Samples/tree/master/samples/typescript_nodejs/13.core-bot and when trying to deploy it to Azure I get the following error on logs:
Invalid start-up command "tsc --build && node ./lib/index.js" in package.json. Please use the format "node <script relative path>".
Any idea what's wrong here?
UPDATE:
{
"name": "core-bot",
"version": "1.0.0",
"description": "A bot that demonstrates core AI capabilities",
"author": "Microsoft Bot Framework Team",
"license": "MIT",
"main": "index.js",
"scripts": {
"build": "tsc --build",
"lint": "tslint -c tslint.json 'src/**/*.ts'",
"postinstall": "npm run build && node ./deploymentScripts/webConfigPrep.js",
"start": "tsc --build && node ./lib/index.js",
"test": "tsc --build && nyc mocha lib/tests/**/*.test.js",
"watch": "node --watch ./src -e ts --exec \"npm run start\""
},
"nyc": {
"extension": [
".ts",
".tsx"
],
"exclude": [
"**/.eslintrc.js",
"**/*.d.ts",
"**/*.test.*",
"**/tests",
"**/coverage",
"**/deploymentScripts",
"**/src/index.ts"
],
"reporter": [
"text"
],
"all": true
},
"dependencies": {
"#microsoft/recognizers-text-data-types-timex-expression": "1.1.4",
"axios": "^0.19.2",
"botbuilder": "~4.7.0",
"botbuilder-ai": "~4.7.0",
"botbuilder-dialogs": "~4.7.0",
"botbuilder-testing": "~4.7.0",
"dotenv": "^8.2.0",
"replace": "~1.1.1",
"restify": "~8.4.0"
},
"devDependencies": {
"#types/dotenv": "6.1.1",
"#types/mocha": "^5.2.7",
"#types/restify": "8.4.1",
"mocha": "^6.2.2",
"nodemon": "^1.19.4",
"nyc": "^14.1.1",
"ts-node": "^8.4.1",
"tslint": "~5.20.0",
"typescript": "~3.6.4"
}
}
i already create app with react-native and it's run perfectly on local devices
when i tried to create apk with
exp build:android
this error appear :- Standalone build failed!
then i run this command expo build:android errors
this is the result:-
Can't read JSON file: /Users/mohamed/Desktop/oils/errors/package.json
[04:58:12] └─ Cause: Error: ENOENT: no such file or directory, open '/Users/mohamed/Desktop/oils/errors/package.json'
/[04:58:12] There is an error with your project. See above logs for information.
[04:58:12] Set EXPO_DEBUG=true in your env to view the stack trace.
here is my package.json file :-
{
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"eject": "expo eject"
},
"dependencies": {
"#expo/vector-icons": "^9.0.0",
"axios": "^0.18.0",
"expo": "^32.0.0",
"native-base": "^2.10.0",
"react": "16.5.0",
"react-native": "https://github.com/expo/react-native/archive/sdk-32.0.0.tar.gz",
"react-native-carousel": "^0.11.0",
"react-native-image-picker": "^0.28.0",
"react-native-modal": "^7.0.2",
"react-native-photo-view": "^1.5.2",
"react-native-render-html": "^3.10.0",
"react-native-responsive-screen": "^1.2.0",
"react-native-snap-carousel": "^3.7.5",
"react-native-swipe-gestures": "^1.0.3",
"react-native-swiper": "^1.5.14",
"react-native-swiper-flatlist": "^1.0.9",
"react-native-vector-icons": "^6.1.0",
"react-native-video": "^4.3.1",
"react-native-video-controls": "^1.5.1",
"react-native-whc-toast": "^1.0.0",
"react-native-youtube": "^1.1.0",
"react-navigation": "^3.0.9"
},
"devDependencies": {
"babel-preset-expo": "^5.0.0",
"reactotron-react-native": "^2.1.4"
},
"private": true
}
my app.json
{
"expo": {
"name": "oils",
"slug": "oils",
"privacy": "public",
"sdkVersion": "32.0.0",
"platforms": [
"ios",
"android"
],
"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,
"bundleIdentifier": "com.kamatcho.oils"
},
"android": {
"package": "com.kamatcho.oils"
}
}
}
How i can fix that ??
I think so
app.json
"sdkVersion": "31.0.0",
or
new expo init newproject.
and
I recommend installing and executing all of the parts in "dependencies" or, if nothing wrong, putting a code in it to do it
Error Message
Unknown plugin \"require-all\" specified in "\project\directory\path\.babelrc.env.development"
My files
.babelrc
{
"presets": ["babel-preset-expo"],
"env": {
"development": {
"plugins": ["transform-react-jsx-source", "require-all"]
}
}
}
package.json
{
"name": "text-adventure-app",
"version": "0.1.0",
"private": true,
"devDependencies": {
"babel-plugin-require-all": "0.0.1",
"jest-expo": "~27.0.0",
"react-native-scripts": "1.14.0",
"react-test-renderer": "16.3.1"
},
"main": "./node_modules/react-native-scripts/build/bin/crna-entry.js",
"scripts": {
"start": "react-native-scripts start",
"eject": "react-native-scripts eject",
"android": "react-native-scripts android",
"ios": "react-native-scripts ios",
"test": "jest"
},
"jest": {
"preset": "jest-expo"
},
"dependencies": {
"clear": "^0.1.0",
"create-react-class": "^15.6.3",
"expo": "^27.0.1",
"react": "16.3.1",
"react-native": "~0.55.2",
"react-native-typewriter": "^0.5.3"
}
}
babel-plugin-require-all
installed via npm as described here:
https://github.com/dushaobindoudou/babel-plugin-require-all
What I've tried
Changing "require-all" to "babel-plugin-require-all"
Deleting and re-installing my node_modules
Clearing npm cache
Scoured the internet for advice on including babel plugins
There is a problem in the package.json for that plugin - there is an extra (space) in the main property which means babel can't resolve it. I verified this by removing the space from the end of the line, and it successfully compiles.
My advice in this case would be to use a different package (maybe something like https://github.com/vihanb/babel-plugin-wildcard could help) or submit a pull request to the babel-plugin-require-all package to remove the extra space.