Main.js file is behaving strange

#1

I have linked my app with ionic pro and have added --prod flag to the build in package.json.
After I have pushed the code to ionic pro servers, the app is built there and it shows successfully but when I open my app it throws an error: ‘Unexpected Syntax error: Unexpected end of input. main.js:1’

I copied my main.js file and there are characters missing at the end of the file.

this is driving me mad and I dont know what to do.

#2

Hey @claDigitalTech,

Same thing here. All my build seem to check out and there’s no errors.

Experiencing a blank white screen after Ionic Deploy finishes doing it’s business. When I look at my device console I see that main.js error you see.

Sent a message to Ionic Support about it. Will see what they come back with and update here if there are any solutions.

Side question, what packages are you using? This is my package.json:

  • cordova-plugin-ionic at 5.0.3
  • cordova-plugin-ionic-webview at 2.0.2
  • @ionic/pro at 2.0.3
  • @ionic/app-scripts at 3.1.11
  • ionic-angular at 3.8.0

…and this is my ionic info:

Ionic:

   ionic (Ionic CLI)  : 4.0.1 (/usr/local/lib/node_modules/ionic)
   Ionic Framework    : ionic-angular 3.8.0
   @ionic/app-scripts : 3.1.11

Cordova:

   cordova (Cordova CLI) : 7.1.0
   Cordova Platforms     : android 6.4.0

System:

   ios-deploy : 1.9.2
   ios-sim    : 5.0.6
   NodeJS     : v8.9.1 (/usr/local/bin/node)
   npm        : 6.1.0
   OS         : macOS High Sierra
   Xcode      : Xcode 9.4.1 Build version 9F2000

Environment:

   ANDROID_HOME : not set
1 Like
#3

Hi my package.json is

  1. cordova-plugin-ionic 5.0.5
  2. cordova-plugin-ionic-webview 2.0.2
  3. @ionic/pro at ^2.0.3
  4. @ionic/app-scripts 3.1.8
  5. ionic-angular 3.9.2

Ionic info:
cli packages: (C:\Users\Naval\AppData\Roaming\npm\node_modules)

@ionic/cli-utils  : 1.19.2
ionic (Ionic CLI) : 3.20.0

global packages:

cordova (Cordova CLI) : 8.0.0

local packages:

@ionic/app-scripts : 3.1.8
Cordova Platforms  : android 7.0.0
Ionic Framework    : ionic-angular 3.9.2

System:

Node : v8.9.4
npm  : 5.6.0
OS   : Windows 7

Environment Variables:

ANDROID_HOME : not set

Misc:

backend : pro
#4

@ccdex_chris Please do let me know if you find anything.
It has something to do with the amount of characters in a single line.
In my case my main.js after prod was cut by 3 characters. So I removed one module of my app and ran the whole process again and this worked perfectly without any issues.
Btw where are you uploading your code ? git, bitbucket or direct ionic?
I am pushing my code directly to ionic server using git workflow.
I thought maybe its the issue with git and had a word with them but they denied any such impositions while commiting and pushing through git.

#5

Unrelated, but:

Your Cordova tooling seems to be out of date, which might be causing all kinds of problems.
You can read about how to figure out the current Cordova versions and how to update CLI, platforms and plugins here: https://ionic.zone/cordova/update

#6

Hi @Sujan12,

You are comparing your cordova (Cordova CLI) version with my Cordova platforms version.
Correct me if I am wrong my cordova CLI version is 8.0.0.

#7

I am comparing what you posted with what I know is the current version.
Your Cordova CLI is fine and current, but the Cordova-Android I quoted is out of date.

#8

My cordova version is upto date.
Anyways just realised the issue is with Pro Client plugin, that is what was having trouble. As soon as i removed the plugin and changes the update method back to background, the app started working.

#9

Yes, as I already said your Cordova CLI is up to date. But your Cordova Android platform is outdated.

And it stays outdated, even when you solved the problem you were currently having.

#10

So, if the Deploy update method is set to background, once you test the app for the first time, it won’t be downloading a snapshot at first. Have you tried closing and reopening the app and double checking if it’s downloading a snapshot?

I’ve been building and rebuilding a lot and may have found the cause… but not the solution yet.

Currently, the issue seems to lie within the “scripts” portion of the package.json file.

When I am pushing a new commit to the Deploy service, my package.json scripts looked like this:

"scripts": {
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build --prod",
    "lint": "ionic-app-scripts lint",
    "ionic:build": "ionic-app-scripts build",
    "ionic:serve": "ionic-app-scripts serve"
  },

Notice the --prod flag under the build command.

When I remove that --prod flag so the scripts look like this:

"scripts": {
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build --prod",
    "lint": "ionic-app-scripts lint",
    "ionic:build": "ionic-app-scripts build",
    "ionic:serve": "ionic-app-scripts serve"
  },

The Deploy snapshot works. I don’t get a white screen and the app is updated.

Not sure why yet… still working with Ionic Support to figure that out. May have more answers on Monday.

Note:
When build a native app that doesn’t download a snapshot using the command ionic cordova build android --prod --release, the app works fine… it’s only when the Deploy plugin downloads a snapshot that was built with the --prod flag do I get that white screen and the errors in the app console.