search

NativeScript / nativescript-dev-webpack

A package to help with webpacking NativeScript apps.
Apache License 2.0
97 stars 49 forks source link

webpack bundle failing. #96

Closed gmsgowtham closed 7 years ago

gmsgowtham commented 7 years ago

I'm having error while bundling ios app. `> npm run ns-bundle --ios --build-app

@ ns-bundle /Users/Supervalu/Documents/RoverHealth/my-project ns-bundle

Running webpack for ios... Hash: fb88379d3666736a03e8 e Version: webpack 2.2.0 Time: 17454ms Asset Size Chunks Chunk Names images/icons/png/images.png 1.52 kB [emitted]
bundle.js 2.56 MB 0 [emitted] [big] bundle vendor.js 3.57 MB 2 [emitted] [big] vendor app.css 16.5 kB 1 [emitted] app.css images/appointment-large.jpg 4.12 MB [emitted] [big]
images/deletcross.jpg 17.8 kB [emitted]
images/appointment.png 7 kB [emitted]
images/bg-image.png 281 bytes [emitted]
images/Blue.png 5.49 kB [emitted]
images/close.png 6.96 kB [emitted]
images/del.png 7.32 kB [emitted]
images/dell.png 47.8 kB [emitted]
images/dropdown.png 2.72 kB [emitted]
images/forward.png 765 bytes [emitted]
images/gradient.png 3.76 kB [emitted]
images/icons/png/agreement.png 1.31 kB [emitted]
images/icons/png/bell.png 612 bytes [emitted]
images/icons/png/bird.png 892 bytes [emitted]
images/icons/png/birdand fish.png 1.37 kB [emitted]
images/icons/png/businessmen.png 1.39 kB [emitted]
images/icons/png/calendar.png 686 bytes [emitted]
images/icons/png/camera.png 956 bytes [emitted]
images/icons/png/cat1.png 1.03 kB [emitted]
images/icons/png/cat2.png 1.27 kB [emitted]
images/icons/png/dog1.png 1.17 kB [emitted]
images/icons/png/dog2.png 982 bytes [emitted]
images/icons/png/fish.png 1.19 kB [emitted]
images/icons/png/heart.png 922 bytes [emitted]
images/icons/png/home.png 14.5 kB [emitted]
app.css.js 268 bytes 1 [emitted] app.css images/icons/png/key.png 953 bytes [emitted]
images/icons/png/like.png 867 bytes [emitted]
images/icons/png/location.png 208 kB [emitted]
images/icons/png/lock open.png 549 bytes [emitted]
images/icons/png/lock.png 583 bytes [emitted]
images/icons/png/logout.png 678 bytes [emitted]
images/icons/png/manwalkingwithdog.png 6.9 kB [emitted]
images/icons/png/money.png 1.07 kB [emitted]
images/icons/png/moneybag.png 979 bytes [emitted]
images/icons/png/note.png 746 bytes [emitted]
images/icons/png/pet bowl.png 4.41 kB [emitted]
images/icons/png/pet with owner.png 1.3 kB [emitted]
images/icons/png/pets.png 1.1 kB [emitted]
images/icons/png/phone.png 1.03 kB [emitted]
images/icons/png/pricetag.png 1.2 kB [emitted]
images/icons/png/rabbit.png 806 bytes [emitted]
images/icons/png/rat.png 1.34 kB [emitted]
images/icons/png/sandclock.png 1.11 kB [emitted]
images/icons/png/settings.png 1.1 kB [emitted]
images/icons/png/spider.png 1.57 kB [emitted]
images/icons/png/successfulman.png 1.36 kB [emitted]
images/icons/png/turtles.png 1.96 kB [emitted]
images/icons/png/user.png 1.34 kB [emitted]
images/icons/png/vet.png 1.29 kB [emitted]
images/icons/png/wifi.png 1.38 kB [emitted]
images/pet-bg.png 16.2 kB [emitted]
images/star-512.png 13.1 kB [emitted]
package.json 101 bytes [emitted]
starter.js 41 bytes [emitted]
[0] ../~/@angular/core/index.js 2.54 kB {2} [built] [197] ../~/@angular/platform-browser/index.js 635 bytes {2} [built] [198] ../~/reflect-metadata/Reflect.js 48.2 kB {2} [built] [297] ../~/nativescript-angular/forms.js 1.46 kB {2} [built] [298] ../~/nativescript-angular/platform.js 1.87 kB {0} [built] [299] ../~/nativescript-angular/router.js 3.1 kB {2} [built] [480] ../~/nativescript-angular/platform-static.js 787 bytes {2} [built] [481] ./modules/app.module.ts 4.72 kB {0} [built] [482] ./vendor-platform.ios.ts 61 bytes {2} [built] [483] ../~/nativescript-drop-down/drop-down.ios.js 16.9 kB {0} [built] [965] ./app.css 41 bytes {1} [built] [966] ./main.ts 473 bytes {0} [built] [967] ./vendor.ts 408 bytes {2} [built] [968] ../~/nativescript-css-loader!../~/nativescript-theme-core/css/core.light.ios.css 13.5 kB [built] [969] ../~/nativescript-css-loader/lib/css-base.js 1.51 kB [built]

ERROR in Error encountered resolving symbol values statically. Calling function 'getBoolean', function calls are not supported. Consider replacing the function or lambda with a reference to an exported function, resolving symbol isLoggedIn in /Users/Supervalu/Documents/RoverHealth/my-project/app/modules/shared/user.service.ts, resolving symbol AppRoutingModule in /Users/Supervalu/Documents/RoverHealth/my-project/app/modules/app-routing.module.ts, resolving symbol AppRoutingModule in /Users/Supervalu/Documents/RoverHealth/my-project/app/modules/app-routing.module.ts, resolving symbol AppRoutingModule in /Users/Supervalu/Documents/RoverHealth/my-project/app/modules/app-routing.module.ts

ERROR in ../~/@angular/core/src/linker/system_js_ng_module_factory_loader.js Module not found: TypeError: Cannot convert undefined or null to object @ ../~/@angular/core/src/linker/system_js_ng_module_factory_loader.js 71:15-36 87:15-102 @ ../~/@angular/core/src/linker.js @ ../~/@angular/core/src/core.js @ ../~/@angular/core/index.js @ ./vendor.ts Child extract-text-webpack-plugin: [0] ../~/nativescript-css-loader/lib/css-base.js 1.51 kB {0} [built] [1] ../~/nativescript-css-loader!../~/nativescript-theme-core/css/core.light.ios.css 13.5 kB {0} [built] [2] ../~/nativescript-css-loader!../~/resolve-url-loader!../~/nativescript-dev-webpack/platform-css-loader.js!./app.css 3.57 kB {0} [built] child process exited with code 2

npm ERR! Darwin 15.5.0 npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "ns-bundle" "--ios" "--build-app" npm ERR! node v6.9.5 npm ERR! npm v3.10.10 npm ERR! code ELIFECYCLE npm ERR! @ ns-bundle: ns-bundle npm ERR! Exit status 2 npm ERR! npm ERR! Failed at the @ ns-bundle script 'ns-bundle'. npm ERR! Make sure you have the latest version of node.js and npm installed. npm ERR! If you do, this is most likely a problem with the package, npm ERR! not with npm itself. npm ERR! Tell the author that this fails on your system: npm ERR! ns-bundle npm ERR! You can get information on how to open an issue for this project with: npm ERR! npm bugs npm ERR! Or if that isn't available, you can get their info via: npm ERR! npm owner ls npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request: npm ERR! /Users/Supervalu/Documents/RoverHealth/my-project/npm-debug.log

npm ERR! Darwin 15.5.0 npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "build-ios-bundle" npm ERR! node v6.9.5 npm ERR! npm v3.10.10 npm ERR! code ELIFECYCLE npm ERR! @ build-ios-bundle: npm run ns-bundle --ios --build-app npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the @ build-ios-bundle script 'npm run ns-bundle --ios --build-app'. npm ERR! Make sure you have the latest version of node.js and npm installed. npm ERR! If you do, this is most likely a problem with the package, npm ERR! not with npm itself. npm ERR! Tell the author that this fails on your system: npm ERR! npm run ns-bundle --ios --build-app npm ERR! You can get information on how to open an issue for this project with: npm ERR! npm bugs npm ERR! Or if that isn't available, you can get their info via: npm ERR! npm owner ls npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request: npm ERR! /Users/Supervalu/Documents/RoverHealth/my-project/npm-debug.log `

And my package.json is

{ "description": "NativeScript Application", "license": "SEE LICENSE IN ", "readme": "NativeScript Application", "repository": "", "nativescript": { "id": "org.nativescript.roverhealth", "tns-ios": { "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", "email-validator": "^1.0.7", "nativescript-angular": "1.4.1", "nativescript-checkbox": "^1.2.5", "nativescript-drop-down": "^1.5.1", "nativescript-iqkeyboardmanager": "^1.0.1", "nativescript-oauth": "^1.3.0", "nativescript-telerik-ui": "^1.6.1", "nativescript-theme-core": "1.0.2", "nativescript-toast": "^1.4.5", "reflect-metadata": "~0.1.8", "rxjs": "5.0.1", "tns-android": "^2.5.0", "tns-core-modules": "^2.5.1" }, "devDependencies": { "@angular/cli": "^1.0.0-rc.0", "@angular/compiler-cli": "2.4.8", "@ngtools/webpack": "1.2.4", "babel-traverse": "6.18.0", "babel-types": "6.18.0", "babylon": "6.13.1", "copy-webpack-plugin": "~3.0.1", "extract-text-webpack-plugin": "~2.0.0-beta.4", "lazy": "1.0.11", "nativescript-css-loader": "~0.26.0", "nativescript-dev-typescript": "^0.3.2", "nativescript-dev-webpack": "^0.3.5", "raw-loader": "~0.5.1", "resolve-url-loader": "~1.6.0", "typescript": "~2.1.0", "webpack": "2.2.0", "webpack-sources": "~0.1.3", "zone.js": "~0.7.2" }, "scripts": { "ns-bundle": "ns-bundle", "start-android-bundle": "npm run ns-bundle --android --start-app", "start-ios-bundle": "npm run ns-bundle --ios --start-app", "build-android-bundle": "npm run ns-bundle --android --build-app", "build-ios-bundle": "npm run ns-bundle --ios --build-app" } }

webpack.common.js

`var webpack = require("webpack"); var nsWebpack = require("nativescript-dev-webpack"); var nativescriptTarget = require("nativescript-dev-webpack/nativescript-target"); var path = require("path"); var CopyWebpackPlugin = require("copy-webpack-plugin"); var ExtractTextPlugin = require("extract-text-webpack-plugin"); var AotPlugin = require("@ngtools/webpack").AotPlugin;

module.exports = function (platform, destinationApp) { if (!destinationApp) { //Default destination inside platforms//... destinationApp = nsWebpack.getAppPath(platform); } var entry = {}; //Discover entry module from package.json entry.bundle = "./" + nsWebpack.getEntryModule(); //Vendor entry with third party libraries. entry.vendor = "./vendor"; //app.css bundle entry["app.css"] = "./app.css";

var plugins = [
    new ExtractTextPlugin("app.css"),
    //Vendor libs go to the vendor.js chunk
    new webpack.optimize.CommonsChunkPlugin({
        name: ["vendor"]
    }),
    //Define useful constants like TNS_WEBPACK
    new webpack.DefinePlugin({
        "global.TNS_WEBPACK": "true",
    }),
    //Copy assets to out dir. Add your own globs as needed.
    new CopyWebpackPlugin([
        { from: "app.css" },
        { from: "css/**" },
        { from: "fonts/**" },
        { from: "**/*.jpg" },
        { from: "**/*.png" },
        { from: "**/*.xml" },
    ], { ignore: ["App_Resources/**"] }),
    //Generate a bundle starter script and activate it in package.json
    new nsWebpack.GenerateBundleStarterPlugin([
        "./vendor",
        "./bundle",
    ]),

    //Angular AOT compiler
    new AotPlugin({
        tsConfigPath: "tsconfig.aot.json",
        entryModule: path.resolve(__dirname, "app/modules/app.module#AppModule"),
        typeChecking: false
    }),
    new nsWebpack.StyleUrlResolvePlugin({platform}),
];

if (process.env.npm_config_uglify) {
    plugins.push(new webpack.LoaderOptionsPlugin({
        minimize: true
    }));

    //Work around an Android issue by setting compress = false
    var compress = platform !== "android";
    plugins.push(new webpack.optimize.UglifyJsPlugin({
        mangle: {
            except: nsWebpack.uglifyMangleExcludes,
        },
        compress: compress,
    }));
}

return {
    context: path.resolve("./app"),
    target: nativescriptTarget,
    entry: entry,
    output: {
        pathinfo: true,
        path: path.resolve(destinationApp),
        libraryTarget: "commonjs2",
        filename: "[name].js",
    },
    resolve: {
        //Resolve platform-specific modules like module.android.js
        extensions: [
            ".aot.ts",
            ".ts",
            ".js",
            ".css",
            "." + platform + ".ts",
            "." + platform + ".js",
            "." + platform + ".css",
        ],
        //Resolve {N} system modules from tns-core-modules
        modules: [
            "node_modules/tns-core-modules",
            "node_modules"
        ]
    },
    node: {
        //Disable node shims that conflict with NativeScript
        "http": false,
        "timers": false,
        "setImmediate": false,
        "fs": "empty",
    },
    module: {
        loaders: [
            {
                test: /\.html$|\.xml$/,
                loaders: [
                    "raw-loader",
                ]
            },
            // Root app.css file gets extracted with bundled dependencies
            {
                test: /app\.css$/,
                loader: ExtractTextPlugin.extract([
                    "nativescript-css-loader",
                    "resolve-url-loader",
                    "nativescript-dev-webpack/platform-css-loader",
                ]),
            },
            // Other CSS files get bundled using the raw loader
            {
                test: /\.css$/,
                exclude: /app\.css$/,
                loaders: [
                    "raw-loader",
                ]
            },
            // Compile TypeScript files with ahead-of-time compiler.
            {
                test: /\.ts$/,
                loaders: [
                    "nativescript-dev-webpack/tns-aot-loader",
                    "@ngtools/webpack",
                ]
            },
            // SASS support
            {
                test: /\.scss$/,
                loaders: [
                    "raw-loader",
                    "resolve-url-loader",
                    "sass-loader"
                ]
            },
        ]
    },
    plugins: plugins,
};

}; `

sis0k0 commented 7 years ago

The problem is with the AppRoutingModule (located in the file app/modules/app-routing.module.ts). As the log says:

function calls are not supported.

The solution (also from the log):

Consider replacing the function or lambda with a reference to an exported function

This is related to the way ahead-of-time compilation works and not with the nativescript-dev-webpack plugin. Closing this.