IOS webpack issue

ios

#1

Hi,

While rendering NSVS on Mac, I am getting issue.

Steps to recreate the issue,​

  1. webpack.config.js (its a root file of NSVS)
    within this file, below line mentioned.
return {
context: resolve('./app'),
target: nativescriptTarget,
entry: {
bundle: (aot && './main.aot.ts') || './main.ts',
vendor: './vendor',
styles: './styles'
},
  1. styles.ts (path: ./app/styles.ts)
// Snapshot the ~/app.css and the theme
const application = require('application');
console.log('_01');
require('ui/styling/style-scope');
console.log('_02');
const appCssContext = require.context('~/', false, /^\.\/app\.(css|scss|less|sass)$/);
console.log('_03');
global.registerWebpackModules(appCssContext);
console.log('_04');
application.loadAppCss();
console.log('_05');

Issue :
If I am running same code on ANDROID then I am getting “console.log”, but on IOS I am not getting any console.log.

Finding :
seems like ‘styles.ts’ is not calling up by webPack.

Root Cause :
‘styles.ts’ file is gateway to load css files (theme files) into the application. and as of now “Styles.ts” is not loading on IOS environment. thats the main issue.

NOTE : if I am deleting ‘Styles.ts’ file on Android then Same UI I am getting what IOS is displaying.

Any suggestion will be greatly appreciated.
Thanks,

below is package.json

{
  "description": "NativeScript POS-Application",
  "version": "1.0.0",
  "nativescript": {
    "id": "org.nativescript.posnativescript",
    "tns-android": {
      "version": "3.4.2"
    },
    "tns-ios": {
      "version": "3.4.1"
    }
  },
  "scripts": {
    "tns": "tns",
    "prepare:android": "tns prepare android",
    "prepare:ios": "tns prepare ios",
    "build:android": "tns build android --bundle --env.aot --env.uglify --env.report",
    "build:android:prod": "tns build android --bundle --env.aot --env.uglify --env.prod --env.report",
    "build:ios": "tns build ios",
    "deploy:android": "tns deploy android",
    "deploy:ios": "tns deploy ios",
    "start": "npm run start:android",
    "start:android": "tns run android --bundle --env.aot --env.uglify",
    "start:android:prod": "tns run android --bundle --env.aot --env.uglify --env.prod",
    "start:ios": "tns run ios",
    "start:ios:prod": "tns run ios --bundle --env.aot --env.uglify --env.prod",
    "test:android": "tns build android && tns test android",
    "test:ios": "tns build ios && tns test ios",
    "clean:android": "tns platform remove android && npm run build:android"
  },
  "dependencies": {
    "@angular/animations": "~5.0.0",
    "@angular/common": "~5.0.0",
    "@angular/compiler": "~5.0.0",
    "@angular/core": "~5.0.0",
    "@angular/forms": "~5.0.0",
    "@angular/http": "~5.0.0",
    "@angular/platform-browser": "~5.0.0",
    "@angular/platform-browser-dynamic": "~5.0.0",
    "@angular/router": "~5.0.0",
    "@ngrx/effects": "^5.0.1",
    "@ngrx/store": "^5.0.0",
    "@ngx-translate/core": "^9.0.2",
    "nativescript": "^3.4.0",
    "nativescript-angular": "~5.2.0",
    "nativescript-localstorage": "^1.1.5",
    "nativescript-theme-core": "~1.0.2",
    "nativescript-ui-sidedrawer": "^3.5.1",
    "nativescript-unit-test-runner": "^0.3.4",
    "reflect-metadata": "~0.1.8",
    "rxjs": "^5.5.0",
    "tns-core-modules": "^3.4.0",
    "zone.js": "^0.8.4"
  },
  "devDependencies": {
    "@angular/compiler-cli": "~5.0.0",
    "@ngtools/webpack": "~1.8.2",
    "@types/jasmine": "^2.8.4",
    "babel-traverse": "6.4.5",
    "babel-types": "6.4.5",
    "babylon": "6.4.5",
    "codelyzer": "^4.0.1",
    "copy-webpack-plugin": "~4.0.1",
    "css-loader": "~0.28.7",
    "extract-text-webpack-plugin": "~3.0.0",
    "imagemin-webpack-plugin": "^1.6.1",
    "jasmine-core": "^2.8.0",
    "karma": "^1.7.1",
    "karma-jasmine": "^1.1.0",
    "karma-nativescript-launcher": "^0.4.0",
    "lazy": "1.0.11",
    "nativescript-css-loader": "~0.26.0",
    "nativescript-dev-sass": "^1.3.2",
    "nativescript-dev-typescript": "^0.6.0",
    "nativescript-dev-webpack": "^0.9.0",
    "nativescript-worker-loader": "~0.8.1",
    "raw-loader": "~0.5.1",
    "resolve-url-loader": "~2.1.0",
    "sass-loader": "~6.0.6",
    "tslint": "~5.8.0",
    "typescript": "~2.4.2",
    "uglifyjs-webpack-plugin": "^1.1.5",
    "webpack": "~3.8.1",
    "webpack-bundle-analyzer": "^2.8.2",
    "webpack-sources": "~1.0.1"
  },
  "engines": {
    "node": "~6.10.2",
    "npm": "~4.4.4"
  }
}


#2

Issue resolved by re-ordering bundle and style

@admin: please close this issue.