"webpackJsonp is not defined" error when building with --snapshot param #247

manojdcoder · 2017-08-08T09:23:52Z

Environment

Node: 6.9.2
TNS CLI: 3.1.3

Steps to reproduce:

Clone nativescript-ui-samples-angular
Update package.json as below (until then webpack build kept failing)

{
  "name": "nativescript-telerik-ui-sdk-angular-examples",
  "version": "3.0.0",
  "description": "Nativescript project that demonstrates the Progress NativeScript UI suite with Angular",
  "license": "SEE LICENSE IN <your-license-filename>",
  "readme": "NativeScript Application",
  "repository": {
    "type": "git",
    "url": "[email protected]/telerik/nativescript-ui-samples-angular.git"
  },
  "nativescript": {
    "id": "org.nativescript.sdkAngular",
    "tns-ios": {
      "version": "3.1.0"
    },
    "tns-android": {
      "version": "3.1.0"
    }
  },
  "dependencies": {
    "@angular/common": "~4.0.0",
    "@angular/compiler": "~4.0.0",
    "@angular/core": "~4.0.0",
    "@angular/forms": "~4.0.0",
    "@angular/http": "~4.0.0",
    "@angular/platform-browser": "~4.0.0",
    "@angular/platform-browser-dynamic": "~4.0.0",
    "@angular/router": "~4.0.0",
    "nativescript-angular": "~3.1.0",
    "nativescript-fresco": "^3.0.2",
    "nativescript-intl": "^3.0.0",
    "nativescript-telerik-ui-pro": "~3.0.3",
    "nativescript-unit-test-runner": "^0.3.2",
    "rxjs": "~5.3.0",
    "tns-core-modules": "3.1.0",
    "zone.js": "~0.8.2"
  },
  "devDependencies": {
    "@angular/compiler-cli": "~4.0.0",
    "@ngtools/webpack": "1.5.3",
    "babel-traverse": "6.24.1",
    "babel-types": "6.24.1",
    "babylon": "6.17.0",
    "chai": "^3.5.0",
    "codelyzer": "^3.0.0",
    "copy-webpack-plugin": "4.0.1",
    "extract-text-webpack-plugin": "3.0.0",
    "filewalker": "0.1.3",
    "karma": "^1.6.0",
    "karma-chai": "^0.1.0",
    "karma-mocha": "^1.3.0",
    "karma-nativescript-launcher": "^0.4.0",
    "lazy": "1.0.11",
    "mocha": "^3.3.0",
    "nativescript-css-loader": "0.26.1",
    "nativescript-dev-android-snapshot": "0.*.*",
    "nativescript-dev-sass": "1.2.0",
    "nativescript-dev-typescript": "0.5.0",
    "nativescript-dev-webpack": "0.7.3",
    "raw-loader": "~0.5.1",
    "resolve-url-loader": "~2.0.2",
    "tns-platform-declarations": "~3.1.0",
    "tslint": "^5.1.0",
    "typescript": "2.3.4",
    "webpack": "3.2.0",
    "webpack-bundle-analyzer": "2.8.2",
    "webpack-sources": "1.0.1"
  },
  "scripts": {
    "ns-bundle": "ns-bundle",
    "publish-ios-bundle": "npm run ns-bundle --ios --publish-app",
    "generate-android-snapshot": "generate-android-snapshot --targetArchs arm,arm64,ia32 --install",
    "start-android-bundle": "npm run ns-bundle --android --run-app",
    "start-ios-bundle": "npm run ns-bundle --ios --run-app",
    "build-android-bundle": "npm run ns-bundle --android --build-app",
    "build-ios-bundle": "npm run ns-bundle --ios --build-app"
  }
}

Run without snapshot (npm run start-android-bundle --uglify), build passed and app works as expected.
Run with snapshot (npm run start-android-bundle --uglify --snapshot) build passed but app throws exception on launch.

An uncaught Exception occurred on "main" thread.
java.lang.RuntimeException: Unable to create application com.tns.NativeScriptApplication: com.tns.NativeScriptException: 

Error calling module function 

ReferenceError: webpackJsonp is not defined
File: "file:///data/data/org.nativescript.sdkAngular/files/app/tns-java-classes.js, line: 1, column: 60

StackTrace: 
	Frame: function:'', file:'file:///data/data/org.nativescript.sdkAngular/files/app/tns-java-classes.js', line: 1, column: 61
	Frame: function:'require', file:'', line: 1, column: 266


ReferenceError: webpackJsonp is not defined
File: "<unknown>, line: 1, column: 265

StackTrace: 
	Frame: function:'', file:'file:///data/data/org.nativescript.sdkAngular/files/app/tns-java-classes.js', line: 1, column: 61
	Frame: function:'require', file:'', line: 1, column: 266


	at android.app.ActivityThread.handleBindApplication(ActivityThread.java:5405)
	at android.app.ActivityThread.-wrap2(ActivityThread.java)
	at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1541)
	at android.os.Handler.dispatchMessage(Handler.java:102)
	at android.os.Looper.loop(Looper.java:154)
	at android.app.ActivityThread.main(ActivityThread.java:6123)
	at java.lang.reflect.Method.invoke(Native Method)
	at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:867)
	at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:757)
Caused by: com.tns.NativeScriptException: 

Error calling module function 

ReferenceError: webpackJsonp is not defined
File: "file:///data/data/org.nativescript.sdkAngular/files/app/tns-java-classes.js, line: 1, column: 60

StackTrace: 
	Frame: function:'', file:'file:///data/data/org.nativescript.sdkAngular/files/app/tns-java-classes.js', line: 1, column: 61
	Frame: function:'require', file:'', line: 1, column: 266


ReferenceError: webpackJsonp is not defined
File: "<unknown>, line: 1, column: 265

StackTrace: 
	Frame: function:'', file:'file:///data/data/org.nativescript.sdkAngular/files/app/tns-java-classes.js', line: 1, column: 61
	Frame: function:'require', file:'', line: 1, column: 266


	at com.tns.Runtime.runModule(Native Method)
	at com.tns.Runtime.runModule(Runtime.java:521)
	at com.tns.RuntimeHelper.initRuntime(RuntimeHelper.java:203)
	at com.tns.NativeScriptApplication.onCreate(NativeScriptApplication.java:17)
	at android.app.Instrumentation.callApplicationOnCreate(Instrumentation.java:1046)
	at android.app.ActivityThread.handleBindApplication(ActivityThread.java:5402)
	... 8 more

The text was updated successfully, but these errors were encountered:

sis0k0 · 2017-08-08T09:32:19Z

10x, but can you post the full build log - from running npm run start-android-bundle --uglify --snapshot to the end. I think the actual error is somewhere above in the log.

manojdcoder · 2017-08-08T09:42:16Z

@sis0k0 Please find the logs attached. I didn't get any error during build, it happens only after app is launched on phone.

build-log.txt
logcat.txt

manojdcoder · 2017-08-11T09:54:56Z

@sis0k0 Any update on this, were you able to reproduce the issue on your end?

sis0k0 · 2017-08-11T11:38:32Z

@manojdcoder The problem is that the old snapshot plugin nativescript-dev-android-snapshot cannot be used with the new one.
If you want to use the new method for generating snapshots - with webpack and the webpack's NativeScriptSnapshotPlugin, you need to remove the old plugin dependency (nativescript-dev-android-snapshot) , as well as its hooks, which are located in hooks/before-prepare/nativescript-dev-android-snapshot.js and hooks/after-prepare/nativescript-dev-android-snapshot.js. Sorry for having that problem, we should definitely mention it in the docs or at least show better error message if the two plugins are used together.

sis0k0 · 2017-08-11T19:14:41Z

Does that solve the problem?

manojdcoder · 2017-08-11T19:47:33Z

@sis0k0 Thanks a lot, it worked with a clean build after removing nativescript-dev-android-snapshot plugin.

I'm not sure how / when nativescript-angular-snapshot plugin was added to my project, but I had to remove that too. Guess that is also a old plugin and discontinued now?

sis0k0 · 2017-08-12T07:52:23Z

It used to be part of the default template till 3.1. Probably, that's why you still had it in your project. The plugin will be deprecated soon. I guess we can close this now?

manojdcoder · 2017-08-12T08:11:49Z

Thanks for the clarification, closing this issue.

govi2010 · 2018-01-05T12:58:46Z

Hello team ,

I am facing same issue.

tns run android --bundle --env.aot --env.uglify --env.snapshot 👍 this work perfectly .
tns build android --bundle --env.aot --env.uglify --env.snapshot 👎 this command build apk successfully but apk doesn't work on device.

Here is error I am getting.

An uncaught Exception occurred on "main" thread.
java.lang.RuntimeException: Unable to instantiate activity ComponentInfo{com.giddh.accounts/com.tns.NativeScriptActivity}: com.tns.NativeScriptException: 

Error calling module function 

TypeError: require.context is not a function
File: "file:///data/data/com.giddh.accounts/files/app/vendor.js, line: 4, column: 30

StackTrace: 
	Frame: function:'', file:'file:///data/data/com.giddh.accounts/files/app/vendor.js', line: 4, column: 31
	Frame: function:'require', file:'', line: 1, column: 266


TypeError: require.context is not a function
File: "<unknown>, line: 1, column: 265

StackTrace: 
	Frame: function:'', file:'file:///data/data/com.giddh.accounts/files/app/vendor.js', line: 4, column: 31
	Frame: function:'require', file:'', line: 1, column: 266


	at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2598)
	at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2757)
	at android.app.ActivityThread.-wrap12(ActivityThread.java)
	at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1504)
	at android.os.Handler.dispatchMessage(Handler.java:102)
	at android.os.Looper.loop(Looper.java:163)
	at android.app.ActivityThread.main(ActivityThread.java:6237)
	at java.lang.reflect.Method.invoke(Native Method)
	at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:877)
	at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:767)
Caused by: com.tns.NativeScriptException: 

Error calling module function 

TypeError: require.context is not a function
File: "file:///data/data/com.giddh.accounts/files/app/vendor.js, line: 4, column: 30

StackTrace: 
	Frame: function:'', file:'file:///data/data/com.giddh.accounts/files/app/vendor.js', line: 4, column: 31
	Frame: function:'require', file:'', line: 1, column: 266


TypeError: require.context is not a function
File: "<unknown>, line: 1, column: 265

StackTrace: 
	Frame: function:'', file:'file:///data/data/com.giddh.accounts/files/app/vendor.js', line: 4, column: 31
	Frame: function:'require', file:'', line: 1, column: 266


	at com.tns.Runtime.runModule(Native Method)
	at com.tns.Runtime.runModule(Runtime.java:530)
	at com.tns.Runtime.createJSInstance(Runtime.java:624)
	at com.tns.Runtime.initInstance(Runtime.java:606)
	at com.tns.NativeScriptActivity.<init>(NativeScriptActivity.java:7)
	at java.lang.Class.newInstance(Native Method)
	at android.app.Instrumentation.newActivity(Instrumentation.java:1079)
	at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2588)
	... 9 more

govi2010 · 2018-01-06T05:14:02Z

log.txt

berchik · 2018-01-19T13:46:51Z

@govi2010 did you manage to find the cause of it? I have the same issue.

pbgc · 2018-03-07T14:06:03Z

@govi2010 any news about this? I'm having the exact same problem.

pbgc · 2018-03-09T00:15:56Z

The solution for this problem is this: NativeScript/nativescript-cli#2730 (comment)

sis0k0 · 2018-03-19T12:19:04Z

Heya, I want to share some information on the issue that @govi2010 described - the app works when built with tns run android, but doesn't work with tns build android. The problem is related to how the {N} livesync work on some Android devices and is logged here: NativeScript/nativescript-cli#2730. What exactly happens and how to manually fix the issue is best described in this comment - NativeScript/nativescript-cli#2730 (comment).

manojdcoder mentioned this issue Aug 8, 2017

"Zone Already Loaded" error when building with --snapshot param #230

Closed

manojdcoder closed this as completed Aug 12, 2017

bfv mentioned this issue Oct 25, 2017

WebpackJsonp is not defined error at run-time #303

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

"webpackJsonp is not defined" error when building with --snapshot param #247

"webpackJsonp is not defined" error when building with --snapshot param #247

manojdcoder commented Aug 8, 2017 •

edited

Loading

sis0k0 commented Aug 8, 2017

manojdcoder commented Aug 8, 2017

manojdcoder commented Aug 11, 2017

sis0k0 commented Aug 11, 2017

sis0k0 commented Aug 11, 2017

manojdcoder commented Aug 11, 2017

sis0k0 commented Aug 12, 2017

manojdcoder commented Aug 12, 2017

govi2010 commented Jan 5, 2018

govi2010 commented Jan 6, 2018

berchik commented Jan 19, 2018

pbgc commented Mar 7, 2018

pbgc commented Mar 9, 2018

sis0k0 commented Mar 19, 2018

"webpackJsonp is not defined" error when building with --snapshot param #247

"webpackJsonp is not defined" error when building with --snapshot param #247

Comments

manojdcoder commented Aug 8, 2017 • edited Loading

sis0k0 commented Aug 8, 2017

manojdcoder commented Aug 8, 2017

manojdcoder commented Aug 11, 2017

sis0k0 commented Aug 11, 2017

sis0k0 commented Aug 11, 2017

manojdcoder commented Aug 11, 2017

sis0k0 commented Aug 12, 2017

manojdcoder commented Aug 12, 2017

govi2010 commented Jan 5, 2018

govi2010 commented Jan 6, 2018

berchik commented Jan 19, 2018

pbgc commented Mar 7, 2018

pbgc commented Mar 9, 2018

sis0k0 commented Mar 19, 2018

manojdcoder commented Aug 8, 2017 •

edited

Loading