Hello,
When I use the plugin "let imagepickerModule = require('nativescript-imagepicker');" (https://github.com/NativeScript/nativescript-imagepicker) and "import { ListViewEventData, RadListView } from 'nativescript-telerik-ui-pro/listview'; " in angular2 of typescript in a component , the error shows as the file below.
can you help me?
13 Answers, 1 is accepted
I reviewed your case and confirm that this is a real issue while using `---pro` and `-` in a NativeScript project. The problem has been related to the fact that `` plugin uses `RadListView` and has `--` as a dependency. When we use the both plugins in the same app, the build will fail.
This problem has been reported here and you could keep track on it for further info. However, in case you need the both plugins, you could follow the below-described steps, which will the problem.
1. open node_modules and delete nativescript-telerik-ui folder.
2. open node_modules/nativescript-imagepicker/package.json file.
search for nativescript-telerik-ui and change the dependency name to nativescript-telerik-ui-pro
3.open node_modules/nativescript-imagepicker/images.ios.js file and replace
var listview_1 = require("nativescript-telerik-ui/listview");var listview_1 = require("nativescript-telerik-ui-pro/listview");5. build with tns run <platform_name>
Keep in mind that if you remove folder you should make those changes again.
Regards,
nikolay.tsonev
Telerik by Progress
Rank 1
Hello,
Thanks for you workground. I tried for android emulator and It works well .But for IOS simulator, I even changed nativescript-imagepicker/images.xml to "<Page xmlns="http://www.nativescript.org/tns.xsd" loaded="pageLoaded"
xmlns:lv="nativescript-telerik-ui-pro/listview">" .It still has the error below, I don't know why .Can you help me?
CONSOLE ERROR file:///app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:344:22: Error: Uncaught (in promise): Error: Could not find module 'nativescript-telerik-ui/listview'. Computed path '/Users/Emerson/Library/Developer/CoreSimulator/Devices/49D85C01-F288-4820-997D-9DCC3B5CB7A0/data/Containers/Bundle/Application/D58A9202-A2F7-463F-894B-529A05817004/gp2mobilenew.app/app/tns_modules/nativescript-telerik-ui/listview'.
Thank you for contacting us back.
I reviewed your case, however, was unable to reproduce this behavior on my side.
Perhaps this issue has been related to some old files that exist in platforms/ios folder and has not been removed properly while rebuilding the app.
When you make the needed changes for replacing nativescript-- with --ui-pro, delete platforms folder from your project and try again to rebuild the app with run ios.
If this does not resolve your problem, please send us a sample project with folder, where the problem could be debugged locally.
Regards,
nikolay.tsonev
Telerik by Progress
Rank 1
Hi,
In order to let you reproduce my problem, I attach my code in github.(https://github.com/ITonly/add-image) . This time a more strange problem . I changed the nativescript-imagepicker plugin locally just like you said above and npm pack it to nativescript-imagepicker-2.5.1.tgz, and put it on my project /package . Everything works well except on IOS device(not simulator ,simulator works well ,and android works well both for device and emulator ). In order to protect nativescript-ui-pro.tgz, I delete it . When you run the demo , please put it under package directory. The error is in the followed file. I even delete the scrollDirection code that the nativescript-imagepicker plugin has ,but the error on IOS device exists . It upset me so much . Can you help me?
Perhaps the problem has been related to need to refer the local nativescript-ui-pro.tgz file in package. file. You could review the below-attached steps, where I include some extra setup steps while using a local file.
1. delete node_modules, platforms, hooks folders
2. run install in the terminal
3.open node_modules and delete folder.
4. open node_modules/-/package. file.
search for --, change the dependency name to ---pro and setup the path to your nativescript-ui-pro.tgz. For example:
"nativescript-telerik-ui-pro": "file:package/nativescript-ui-pro.tgz",5.open node_modules/nativescript-imagepicker/images.ios.js file and replace
var listview_1 = require("nativescript-telerik-ui/listview")var listview_1 = require("nativescript-telerik-ui-pro/listview");6.open node_modules/-/images.xml file and replace
xmlns:lv="nativescript-telerik-ui/listview"xmlns:lv="nativescript-telerik-ui-pro/listview"Hope this helps.
Regards,
nikolay.tsonev
Telerik by Progress
Rank 1
Hello,
Although it doesn't solve my problem ,thanks all the same!
I tested again your sample project on my side while using file from your project and a local nativescript-ui-pro.tgz file, however, I am still unable to reproduce the same behavior.
Regarding that, it would help if you could provide some more info about your environment(CLI, node versions ) and info about the device, you are using for testing.
In the you could verify, whether you will have the same behavior while using the -imagepicker from NPM, instead of using your local file and to apply the described setup steps from my previous message. For your convenience, I am attaching sample package. file.
package.json
{ "description": "NativeScript GuanPlus Application", "license": "SEE LICENSE IN <your-license-filename>", "readme": "NativeScript GuanPlus Application", "repository": "<fill-your-repository-here>", "nativescript": { "id": "com.concordya.mobile.gp2", "tns-ios": { "version": "2.5.0" }, "tns-android": { "version": "2.5.0" } }, "dependencies": { "@angular/common": "2.4.8", "@angular/compiler": "2.4.8", "@angular/core": "2.4.8", "@angular/forms": "2.4.8", "@angular/http": "2.4.8", "@angular/platform-browser": "2.4.8", "@angular/platform-browser-dynamic": "2.4.8", "@angular/router": "3.4.8", "crypto-js": "3.1.8", "lodash": "4.17.4", "moment": "2.17.1", "nativescript-angular": "1.4.0", "nativescript-appversion": "1.3.3", "nativescript-background-http": "2.5.1", "nativescript-camera": "0.0.8", "nativescript-dom": "1.0.8", "nativescript-drop-down": "*", "nativescript-fingerprint-auth": "3.0.1", "nativescript-imagepicker": "*", "nativescript-iqkeyboardmanager": "1.0.1", "nativescript-loading-indicator": "2.2.2", "nativescript-master-technology": "*", "nativescript-permissions": "^1.2.3", "nativescript-social-share": "1.3.2", "nativescript-telerik-ui-pro": "file:package/nativescript-ui-pro.tgz", "nativescript-toast": "1.4.5", "nativescript-web-image-cache": "*", "nativescript-webview-interface": "1.4.1", "reflect-metadata": "0.1.9", "rxjs": "5.2.0", "tns-core-modules": "2.5.1" }, "devDependencies": { "@angular/compiler-cli": "2.4.8", "@ngtools/webpack": "1.2.10", "@types/cryptojs": "3.1.29", "@types/lodash": "4.14.52", "babel-traverse": "6.23.1", "babel-types": "6.23.0", "babylon": "6.15.0", "codelyzer": "2.0.1", "copy-webpack-plugin": "4.0.1", "css-loader": "0.26.1", "extract-text-webpack-plugin": "2.0.0-beta.4", "fs-extra": "2.0.0", "glob": "7.1.1", "htmlparser2": "3.9.2", "lazy": "1.0.11", "nativescript-css-loader": "0.26.1", "nativescript-dev-sass": "0.4.2", "nativescript-dev-typescript": "0.3.7", "nativescript-dev-webpack": "0.3.3", "node-sass": "4.5.0", "raw-loader": "0.5.1", "resolve-url-loader": "2.0.0", "sass-loader": "6.0.1", "tslint": "4.4.2", "typescript": "2.1.6", "webpack": "2.2.1", "webpack-sources": "0.1.4", "zone.js": "0.7.7" }, "scripts": { "clean-android": "tns clean-app android", "clean-ios": "tns clean-app ios", "compile-scss-ios": "OS='ios' node config/nativescript-sass-compile.js", "compile-scss-android": "OS='android' node config/nativescript-sass-compile.js", "prewebpack-android": "npm run clean-android", "prewebpack-ios": "npm run clean-ios", "webpack-android": "npm run compile-scss-android && webpack --config=webpack.android.js --progress", "webpack-ios": "npm run compile-scss-ios && webpack --config=webpack.ios.js --progress", "prestart-android-bundle": "npm run webpack-android", "prestart-ios-bundle": "npm run webpack-ios", "start-android-bundle-dev": "ENV_NODE='development' npm run start-android-bundle", "start-android-bundle-stage": "ENV_NODE='stage' npm run start-android-bundle", "start-android-bundle-prod": "ENV_NODE='production' npm_config_uglify=true npm run start-android-bundle -- --release --key-store-path gp2-mobile.jks --key-store-password Qq123456 --key-store-alias guanplus --key-store-alias-password Qq123456", "start-android-bundle": "tns run android --bundle --disable-npm-install", "start-ios-bundle-dev": "ENV_NODE='development' npm run start-ios-bundle", "start-ios-bundle-stage": "ENV_NODE='stage' npm run start-ios-bundle", "start-ios-bundle-prod": "ENV_NODE='production' npm_config_uglify=true npm run start-ios-bundle", "start-ios-bundle": "tns run ios --bundle --disable-npm-install", "build-android-bundle-dev": "ENV_NODE='development' npm run build-android-bundle", "build-android-bundle-stage": "ENV_NODE='stage' npm run build-android-bundle", "build-android-bundle-prod": "ENV_NODE='production' npm_config_uglify=true npm run build-android-bundle -- --release --key-store-path gp2-mobile.jks --key-store-password Qq123456 --key-store-alias guanplus --key-store-alias-password Qq123456", "prebuild-android-bundle": "npm run webpack-android", "prebuild-ios-bundle": "npm run webpack-ios", "build-android-bundle": "tns build android --bundle --disable-npm-install", "build-ios-bundle-dev": "ENV_NODE='development' npm run build-ios-bundle", "build-ios-bundle-stage": "ENV_NODE='stage' npm run build-ios-bundle", "build-ios-bundle-prod": "ENV_NODE='production' npm run build-ios-bundle -- --release --for-device", "build-ios-bundle": "tns build ios --bundle --disable-npm-install" }}Thank you in advance for your cooperation.
Regards,
nikolay.tsonev
Telerik by Progress
Rank 1
Hello,
My node version is V6.9.1
device info is IOS 6 PLUS Version 10.2(14C92) and the Model is MGAH2LL/A
And if I use the nativescript-imagepicker from NPM, instead of using my local tgz file and change as you said before, even the iOS emulator has the same error ,not just device .And that’s why I changed to local .tgz file . It upsets me so much .And I try to use “npm run start-ios-bundle-dev “ as my package.json write. It still has problem. I don’t know how to do.
I'm sorry for any inconvenience, which this issue is causing you.
We are still trying to reproduce this behavior. Regarding that, could you provide the error you are receiving in the console while building the app?
At this point, it would help if you could provide the exact steps, you are using while building the app. It would also help if you could give us info, whether this problem appears while using run ios or only while building with run start-ios-bundle-dev.
For your convenience, I am attaching a link to the project with included `node_modules` folder with all needed changes. You could clone the repo and verify, whether you will have the same problem while building with run ios.
Regards,
nikolay.tsonev
Telerik by Progress
Rank 1
Hello,
Thanks very much. I clone your project ,I didn't change anything,and 'tns run ios' ,when I tap 'choose image',the same error occurs just like before. This problem appears while using tns run ios ,but npm run start-ios-bundle-dev is ok.
CONSOLE ERROR file:///app/tns_modules/@angular/core/bundles/core.umd.js:3064:32: EXCEPTION: Uncaught (in promise): Error: Property scrollDirection already registered for type ListViewLayoutBase.
CONSOLE ERROR file:///app/tns_modules/@angular/core/bundles/core.umd.js:3069:36: ORIGINAL STACKTRACE:
CONSOLE ERROR file:///app/tns_modules/@angular/core/bundles/core.umd.js:3070:36: resolvePromise@file:///app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:416:40
file:///app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:452:31
invokeTask@file:///app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:223:42
onInvokeTask@file:///app/tns_modules/@angular/core/bundles/core.umd.js:3971:51
invokeTask@file:///app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:222:54
runTask@file:///app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:123:57
drainMicroTaskQueue@file:///app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:355:42
promiseReactionJob@[native code]
UIApplicationMain@[native code]
start@file:///app/tns_modules/tns-core-modules/application/application.js:251:26
bootstrapApp@file:///app/tns_modules/nativescript-angular/platform-common.js:68:28
bootstrapModule@file:///app/tns_modules/nativescript-angular/platform-common.js:56:26
anonymous@file:///app/main.js:13:72
evaluate@[native code]
moduleEvaluation@[native code]
[native code]
promiseReactionJob@[native code]
CONSOLE ERROR file:///app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:342:26: Unhandled Promise rejection: Property scrollDirection already registered for type ListViewLayoutBase. ; Zone: angular ; Task: Promise.then ; Value: Error: Property scrollDirection already registered for type ListViewLayoutBase. Property@file:///app/tns_modules/tns-core-modules/ui/core/dependency-observable.js:73:28
file:///app/tns_modules/nativescript-telerik-ui-pro/listview/listview-common.js:337:83
anonymous@file:///app/tns_modules/nativescript-telerik-ui-pro/listview/listview-common.js:343:2
evaluate@[native code]
moduleEvaluation@[native code]
[native code]
promiseReactionJob@[native code]
require@[native code]
anonymous@file:///app/tns_modules/nativescript-telerik-ui-pro/listview/listview.js:4:27
evaluate@[native code]
moduleEvaluation@[native code]
[native code]
promiseReactionJob@[native code]
require@[native code]
anonymous@file:///app/tns_modules/nativescript-imagepicker/images.js:7:25
evaluate@[native code]
moduleEvaluation@[native code]
[native code]
promiseReactionJob@[native code]
require@[native code]
anonymous@file:///app/tns_modules/nativescript-imagepicker/albums.js:11:31
evaluate@[native code]
moduleEvaluation@[native code]
[native code]
promiseReactionJob@[native code]
require@[native code]
anonymous@file:///app/tns_modules/nativescript-imagepicker/viewmodel.js:12:31
evaluate@[native code]
moduleEvaluation@[native code]
[native code]
promiseReactionJob@[native code]
require@[native code]
onSelectMultipleTap@file:///app/component/transaction/transaction-image.component.js:167:34
file:///app/component/transaction/transaction-image.component.js:240:42
invoke@file:///app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:190:33
onInvoke@file:///app/tns_modules/@angular/core/bundles/core.umd.js:3980:47
invoke@file:///app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:189:42
run@file:///app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:83:49
file:///app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:449:60
invokeTask@file:///app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:223:42
onInvokeTask@file:///app/tns_modules/@angular/core/bundles/core.umd.js:3971:51
invokeTask@file:///app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:222:54
runTask@file:///app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:123:57
drainMicroTaskQueue@file:///app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:355:42
promiseReactionJob@[native code]
UIApplicationMain@[native code]
start@file:///app/tns_modules/tns-core-modules/application/application.js:251:26
bootstrapApp@file:///app/tns_modules/nativescript-angular/platform-common.js:68:28
bootstrapModule@file:///app/tns_modules/nativescript-angular/platform-common.js:56:26
anonymous@file:///app/main.js:13:72
evaluate@[native code]
moduleEvaluation@[native code]
[native code]
promiseReactionJob@[native code]
CONSOLE ERROR file:///app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:344:22: Error: Uncaught (in promise): Error: Property scrollDirection already registered for type ListViewLayoutBase.
Rank 1
Hello,
My project (https://github.com/ITonly/add-image )can run locally using 'tns run ios ‘ or 'npm run start-ios-bundle-dev ‘ (when use bundle, comment one code in app.module.ts ) and I have updated nativescript-imagepicker-2.5.1.tgz. When I run using bundle by 'npm run start-ios-bundle-dev ', the error ui_frame and platform can't be found ,so I changed in images.ios.ts "import application = require("application"); import ui_frame = require("ui/frame"); import platform = require("platform");" to "import * as platform from 'platform';
// import data_observable = require("data/observable");
// import data_observablearray = require("data/observable-array");
import * as data_observable from "data/observable";
import * as data_observablearray from "data/observable-array";
//import ui_frame = require("ui/frame");
import * as frame from "ui/frame";
import { Page } from "ui/page”;
This way, this problem appears while using tns run ios ,but npm run start-ios-bundle-dev is ok.
Thank you for the further info.
I was able to reproduce this behavior on my side while using the project from the attached GitHub repository.
This issue happens, when `nativescript--` and `---pro` are referenced in the same app by different plugins.
This issue will be fixed with the new NativeScript release 3.0. At this point, I cannot commit to an exact time frame when this will be ready.
For further info, you could also keep track on this issue.
In the meantime, you could use ` run start-ios-bundle-dev` while building for real device.
Regards,
nikolay.tsonev
Telerik by Progress
Rank 1
Hi My Name is Radit,
Here is my solution
Look at the tns info
and look your tns-android/tns-runtime version
also tns-core-modules version
The stable version is tns-android : 2.5.0
tns-core-modules : 2.5.0
How to : remove your current android runtime first
tns platform remove android
then install tns platform add android@2.5.0
and also install your tns-core-modules
tns plugin remove tns-core-modules
tns plugin add tns-core-modules@2.5.0
hope this helps