{"action":"created","issue":{"url":"https://api.github.com/repos/NativeScript/nativescript-dev-webpack/issues/616","repository_url":"https://api.github.com/repos/NativeScript/nativescript-dev-webpack","labels_url":"https://api.github.com/repos/NativeScript/nativescript-dev-webpack/issues/616/labels{/name}","comments_url":"https://api.github.com/repos/NativeScript/nativescript-dev-webpack/issues/616/comments","events_url":"https://api.github.com/repos/NativeScript/nativescript-dev-webpack/issues/616/events","html_url":"https://github.com/NativeScript/nativescript-dev-webpack/issues/616","id":342558652,"node_id":"MDU6SXNzdWUzNDI1NTg2NTI=","number":616,"title":"RE: Icon doesn't when using --bundle with nativescript-dev-webpack","user":{"login":"samliaw","id":8423978,"node_id":"MDQ6VXNlcjg0MjM5Nzg=","avatar_url":"https://avatars3.githubusercontent.com/u/8423978?v=4","gravatar_id":"","url":"https://api.github.com/users/samliaw","html_url":"https://github.com/samliaw","followers_url":"https://api.github.com/users/samliaw/followers","following_url":"https://api.github.com/users/samliaw/following{/other_user}","gists_url":"https://api.github.com/users/samliaw/gists{/gist_id}","starred_url":"https://api.github.com/users/samliaw/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/samliaw/subscriptions","organizations_url":"https://api.github.com/users/samliaw/orgs","repos_url":"https://api.github.com/users/samliaw/repos","events_url":"https://api.github.com/users/samliaw/events{/privacy}","received_events_url":"https://api.github.com/users/samliaw/received_events","type":"User","site_admin":false},"labels":[{"id":704167666,"node_id":"MDU6TGFiZWw3MDQxNjc2NjY=","url":"https://api.github.com/repos/NativeScript/nativescript-dev-webpack/labels/os:%20android","name":"os: android","color":"006b75","default":false},{"id":349341365,"node_id":"MDU6TGFiZWwzNDkzNDEzNjU=","url":"https://api.github.com/repos/NativeScript/nativescript-dev-webpack/labels/question","name":"question","color":"cc317c","default":true}],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":3,"created_at":"2018-07-19T02:41:36Z","updated_at":"2018-07-20T07:57:02Z","closed_at":"2018-07-20T07:57:02Z","author_association":"NONE","body":"## Issue Checklist\r\n\r\n- [x] You are submitting: a bug <!-- a feature request; a bug report. For questions, please use the [NativeScript Forum]. -->\r\n- [x] You verified that this is a real problem by searching the [NativeScript Forum] and the other [issues] in this repo.\r\n- [ ] You checked our [demo apps] and the [documentation] for sample usage.\r\n\r\n## Tell us about the problem\r\n<!-- Describe the issue with a few words. Provide build log and steps to reproduce if relevant. -->\r\nThe issue is I build the android with --bundle, the icon will not shown.\r\n\r\nI have attached the whole project excluding node_modules, hooks and platforms. \r\nIf I run it with \"tns run android --emulator\", I am able to see the icon.\r\nIf I run it with \"tns run android --bundle\", the icon is not showing. \r\n\r\nI don't see any error showing. \r\n\r\n[Test With nativescript-dev-webpack.zip](https://github.com/NativeScript/nativescript-dev-webpack/files/2207984/Test.With.nativescript-dev-webpack.zip)\r\n## Local environment\r\n\r\n- [x] Platform Windows 10 Pro 64 Bits <!-- Linux, Mac, Windows -->\r\n- [x] Node version 8.11.1 <!-- run `node --version` -->\r\n- [x] NativeScript CLI version 4.1.2<!-- run `tns --version` -->\r\n\r\n## Project data\r\n\r\n- [x] Platform you are building the app for Android <!-- Android, iOS, Both -->\r\n- [ ] Node dependencies:\r\n```\r\n{\r\n  \"description\": \"NativeScript Application\",\r\n  \"license\": \"SEE LICENSE IN <your-license-filename>\",\r\n  \"readme\": \"NativeScript Application\",\r\n  \"repository\": \"<fill-your-repository-here>\",\r\n  \"nativescript\": {\r\n    \"id\": \"org.nativescript.test1\",\r\n    \"tns-android\": {\r\n      \"version\": \"4.1.3\"\r\n    }\r\n  },\r\n  \"dependencies\": {\r\n    \"@angular/animations\": \"~6.0.0\",\r\n    \"@angular/common\": \"~6.0.0\",\r\n    \"@angular/compiler\": \"~6.0.0\",\r\n    \"@angular/core\": \"~6.0.0\",\r\n    \"@angular/forms\": \"~6.0.0\",\r\n    \"@angular/http\": \"~6.0.0\",\r\n    \"@angular/platform-browser\": \"~6.0.0\",\r\n    \"@angular/platform-browser-dynamic\": \"~6.0.0\",\r\n    \"@angular/router\": \"~6.0.0\",\r\n    \"nativescript-angular\": \"~6.0.0\",\r\n    \"nativescript-dev-webpack\": \"^0.14.4\",\r\n    \"nativescript-ngx-fonticon\": \"^4.2.0\",\r\n    \"nativescript-theme-core\": \"~1.0.4\",\r\n    \"reflect-metadata\": \"~0.1.8\",\r\n    \"rxjs\": \"~6.1.0\",\r\n    \"tns-core-modules\": \"~4.1.0\",\r\n    \"zone.js\": \"^0.8.26\"\r\n  },\r\n  \"devDependencies\": {\r\n    \"babel-traverse\": \"6.4.5\",\r\n    \"babel-types\": \"6.4.5\",\r\n    \"babylon\": \"6.4.5\",\r\n    \"lazy\": \"1.0.11\",\r\n    \"nativescript-dev-typescript\": \"~0.7.0\",\r\n    \"typescript\": \"~2.7.2\",\r\n    \"@angular/compiler-cli\": \"~6.1.0-beta.3\",\r\n    \"@ngtools/webpack\": \"6.1.0-rc.0\"\r\n  }\r\n}\r\n\r\n<!-- Provide the content of your package.json. -->\r\n```\r\n\r\n- [ ] Webpack configuration:\r\n```\r\nconst { join, relative, resolve, sep } = require(\"path\");\r\n\r\nconst webpack = require(\"webpack\");\r\nconst nsWebpack = require(\"nativescript-dev-webpack\");\r\nconst nativescriptTarget = require(\"nativescript-dev-webpack/nativescript-target\");\r\nconst { PlatformReplacementHost } = require(\"nativescript-dev-webpack/host/platform\");\r\nconst CleanWebpackPlugin = require(\"clean-webpack-plugin\");\r\nconst CopyWebpackPlugin = require(\"copy-webpack-plugin\");\r\nconst { BundleAnalyzerPlugin } = require(\"webpack-bundle-analyzer\");\r\nconst { NativeScriptWorkerPlugin } = require(\"nativescript-worker-loader/NativeScriptWorkerPlugin\");\r\nconst UglifyJsPlugin = require(\"uglifyjs-webpack-plugin\");\r\nconst { AngularCompilerPlugin } = require(\"@ngtools/webpack\");\r\n\r\nmodule.exports = env => {\r\n    // Add your custom Activities, Services and other Android app components here.\r\n    const appComponents = [\r\n        \"tns-core-modules/ui/frame\",\r\n        \"tns-core-modules/ui/frame/activity\",\r\n    ];\r\n\r\n    const platform = env && (env.android && \"android\" || env.ios && \"ios\");\r\n    if (!platform) {\r\n        throw new Error(\"You need to provide a target platform!\");\r\n    }\r\n\r\n    const extensions = [\"tns\", platform];\r\n    const platformHost = new PlatformReplacementHost(extensions);\r\n\r\n    const projectRoot = __dirname;\r\n\r\n    // Default destination inside platforms/<platform>/...\r\n    const dist = resolve(projectRoot, nsWebpack.getAppPath(platform, projectRoot));\r\n    const appResourcesPlatformDir = platform === \"android\" ? \"Android\" : \"iOS\";\r\n\r\n    const {\r\n        // The 'appPath' and 'appResourcesPath' values are fetched from\r\n        // the nsconfig.json configuration file\r\n        // when bundling with `tns run android|ios --bundle`.\r\n        appPath = \"app\",\r\n        appResourcesPath = \"app/App_Resources\",\r\n\r\n        // You can provide the following flags when running 'tns run android|ios'\r\n        aot, // --env.aot\r\n        snapshot, // --env.snapshot\r\n        uglify, // --env.uglify\r\n        report, // --env.report\r\n    } = env;\r\n\r\n    const appFullPath = resolve(projectRoot, appPath);\r\n    const appResourcesFullPath = resolve(projectRoot, appResourcesPath);\r\n\r\n    const entryModule = aot ?\r\n        nsWebpack.getAotEntryModule(appFullPath) : \r\n        `${nsWebpack.getEntryModule(appFullPath)}.ts`;\r\n    const entryPath = `.${sep}${entryModule}`;\r\n\r\n    const config = {\r\n        mode: uglify ? \"production\" : \"development\",\r\n        context: appFullPath,\r\n        watchOptions: {\r\n            ignored: [\r\n                appResourcesFullPath,\r\n                // Don't watch hidden files\r\n                \"**/.*\",\r\n            ]\r\n        },\r\n        target: nativescriptTarget,\r\n        entry: {\r\n            bundle: entryPath,\r\n        },\r\n        output: {\r\n            pathinfo: false,\r\n            path: dist,\r\n            libraryTarget: \"commonjs2\",\r\n            filename: \"[name].js\",\r\n            globalObject: \"global\",\r\n        },\r\n        resolve: {\r\n            extensions: [\".ts\", \".js\", \".scss\", \".css\"],\r\n            // Resolve {N} system modules from tns-core-modules\r\n            modules: [\r\n                resolve(__dirname, \"node_modules/tns-core-modules\"),\r\n                resolve(__dirname, \"node_modules\"),\r\n                \"node_modules/tns-core-modules\",\r\n                \"node_modules\",\r\n            ],\r\n            alias: {\r\n                '~': appFullPath\r\n            },\r\n            symlinks: true\r\n        },\r\n        resolveLoader: {\r\n            symlinks: false\r\n        },\r\n        node: {\r\n            // Disable node shims that conflict with NativeScript\r\n            \"http\": false,\r\n            \"timers\": false,\r\n            \"setImmediate\": false,\r\n            \"fs\": \"empty\",\r\n            \"__dirname\": false,\r\n        },\r\n        devtool: \"none\",\r\n        optimization: {\r\n            splitChunks: {\r\n                cacheGroups: {\r\n                    vendor: {\r\n                        name: \"vendor\",\r\n                        chunks: \"all\",\r\n                        test: (module, chunks) => {\r\n                            const moduleName = module.nameForCondition ? module.nameForCondition() : '';\r\n                            return /[\\\\/]node_modules[\\\\/]/.test(moduleName) ||\r\n                                    appComponents.some(comp => comp === moduleName);\r\n                        },\r\n                        enforce: true,\r\n                    },\r\n                }\r\n            },\r\n            minimize: !!uglify,\r\n            minimizer: [\r\n                new UglifyJsPlugin({\r\n                    uglifyOptions: {\r\n                        parallel: true,\r\n                        cache: true,\r\n                        output: {\r\n                            comments: false,\r\n                        },\r\n                        compress: {\r\n                            // The Android SBG has problems parsing the output\r\n                            // when these options are enabled\r\n                            'collapse_vars': platform !== \"android\",\r\n                            sequences: platform !== \"android\",\r\n                        }\r\n                    }\r\n                })\r\n            ],\r\n        },\r\n        module: {\r\n            rules: [\r\n                {\r\n                    test: new RegExp(entryPath),\r\n                    use: [\r\n                        // Require all Android app components\r\n                        platform === \"android\" && {\r\n                            loader: \"nativescript-dev-webpack/android-app-components-loader\",\r\n                            options: { modules: appComponents }\r\n                        },\r\n\r\n                        {\r\n                            loader: \"nativescript-dev-webpack/bundle-config-loader\",\r\n                            options: {\r\n                                angular: true,\r\n                                loadCss: !snapshot, // load the application css if in debug mode\r\n                            }\r\n                        },\r\n                    ].filter(loader => !!loader)\r\n                },\r\n\r\n                { test: /\\.html$|\\.xml$/, use: \"raw-loader\" },\r\n\r\n                // tns-core-modules reads the app.css and its imports using css-loader\r\n                {\r\n                    test: /[\\/|\\\\]app\\.css$/,\r\n                    use: {\r\n                        loader: \"css-loader\",\r\n                        options: { minimize: false, url: false },\r\n                    }\r\n                },\r\n                {\r\n                    test: /[\\/|\\\\]app\\.scss$/,\r\n                    use: [\r\n                        { loader: \"css-loader\", options: { minimize: false, url: false } },\r\n                        \"sass-loader\"\r\n                    ]\r\n                },\r\n\r\n                // Angular components reference css files and their imports using raw-loader\r\n                { test: /\\.css$/, exclude: /[\\/|\\\\]app\\.css$/, use: \"raw-loader\" },\r\n                { test: /\\.scss$/, exclude: /[\\/|\\\\]app\\.scss$/, use: [\"raw-loader\", \"resolve-url-loader\", \"sass-loader\"] },\r\n\r\n                // Compile TypeScript files with ahead-of-time compiler.\r\n                {\r\n                    test: /.ts$/, use: [\r\n                        \"nativescript-dev-webpack/moduleid-compat-loader\",\r\n                        \"@ngtools/webpack\",\r\n                    ]\r\n                },\r\n\r\n                // Mark files inside `@angular/core` as using SystemJS style dynamic imports.\r\n                // Removing this will cause deprecation warnings to appear.\r\n                {\r\n                    test: /[\\/\\\\]@angular[\\/\\\\]core[\\/\\\\].+\\.js$/,\r\n                    parser: { system: true },\r\n                },\r\n            ],\r\n        },\r\n        plugins: [\r\n            // Define useful constants like TNS_WEBPACK\r\n            new webpack.DefinePlugin({\r\n                \"global.TNS_WEBPACK\": \"true\",\r\n            }),\r\n            // Remove all files from the out dir.\r\n            new CleanWebpackPlugin([ `${dist}/**/*` ]),\r\n            // Copy native app resources to out dir.\r\n            new CopyWebpackPlugin([\r\n                {\r\n                    from: `${appResourcesFullPath}/${appResourcesPlatformDir}`,\r\n                    to: `${dist}/App_Resources/${appResourcesPlatformDir}`,\r\n                    context: projectRoot\r\n                },\r\n            ]),\r\n            // Copy assets to out dir. Add your own globs as needed.\r\n            new CopyWebpackPlugin([\r\n                { from: \"fonts/**\" },\r\n                { from: \"**/*.jpg\" },\r\n                { from: \"**/*.png\" },\r\n            ], { ignore: [`${relative(appPath, appResourcesFullPath)}/**`] }),\r\n            // Generate a bundle starter script and activate it in package.json\r\n            new nsWebpack.GenerateBundleStarterPlugin([\r\n                \"./vendor\",\r\n                \"./bundle\",\r\n            ]),\r\n            // For instructions on how to set up workers with webpack\r\n            // check out https://github.com/nativescript/worker-loader\r\n            new NativeScriptWorkerPlugin(),\r\n\r\n            new AngularCompilerPlugin({\r\n                host: platformHost,\r\n                entryModule: resolve(appPath, \"app.module#AppModule\"),\r\n                tsConfigPath: join(__dirname, \"tsconfig.esm.json\"),\r\n                skipCodeGeneration: !aot,\r\n            }),\r\n            // Does IPC communication with the {N} CLI to notify events when running in watch mode.\r\n            new nsWebpack.WatchStateLoggerPlugin(),\r\n        ],\r\n    };\r\n\r\n    if (report) {\r\n        // Generate report files for bundles content\r\n        config.plugins.push(new BundleAnalyzerPlugin({\r\n            analyzerMode: \"static\",\r\n            openAnalyzer: false,\r\n            generateStatsFile: true,\r\n            reportFilename: resolve(projectRoot, \"report\", `report.html`),\r\n            statsFilename: resolve(projectRoot, \"report\", `stats.json`),\r\n        }));\r\n    }\r\n\r\n    if (snapshot) {\r\n        config.plugins.push(new nsWebpack.NativeScriptSnapshotPlugin({\r\n            chunk: \"vendor\",\r\n            angular: true,\r\n            requireModules: [\r\n                \"reflect-metadata\",\r\n                \"@angular/platform-browser\",\r\n                \"@angular/core\",\r\n                \"@angular/common\",\r\n                \"@angular/router\",\r\n                \"nativescript-angular/platform-static\",\r\n                \"nativescript-angular/router\",\r\n            ],\r\n            projectRoot,\r\n            webpackConfig: config,\r\n        }));\r\n    }\r\n\r\n    return config;\r\n};\r\n\r\n<!-- Provide the content of your webpack.config.js. -->\r\n```\r\n\r\n[NativeScript Forum]: http://forum.nativescript.org\r\n[issues]: https://github.com/nativescript/nativescript-dev-webpack/issues?utf8=✓&q=is%3Aissue\r\n[demo apps]: ../demo\r\n[documentation]: https://docs.nativescript.org/best-practices/bundling-with-webpack\r\n"},"comment":{"url":"https://api.github.com/repos/NativeScript/nativescript-dev-webpack/issues/comments/406519706","html_url":"https://github.com/NativeScript/nativescript-dev-webpack/issues/616#issuecomment-406519706","issue_url":"https://api.github.com/repos/NativeScript/nativescript-dev-webpack/issues/616","id":406519706,"node_id":"MDEyOklzc3VlQ29tbWVudDQwNjUxOTcwNg==","user":{"login":"samliaw","id":8423978,"node_id":"MDQ6VXNlcjg0MjM5Nzg=","avatar_url":"https://avatars3.githubusercontent.com/u/8423978?v=4","gravatar_id":"","url":"https://api.github.com/users/samliaw","html_url":"https://github.com/samliaw","followers_url":"https://api.github.com/users/samliaw/followers","following_url":"https://api.github.com/users/samliaw/following{/other_user}","gists_url":"https://api.github.com/users/samliaw/gists{/gist_id}","starred_url":"https://api.github.com/users/samliaw/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/samliaw/subscriptions","organizations_url":"https://api.github.com/users/samliaw/orgs","repos_url":"https://api.github.com/users/samliaw/repos","events_url":"https://api.github.com/users/samliaw/events{/privacy}","received_events_url":"https://api.github.com/users/samliaw/received_events","type":"User","site_admin":false},"created_at":"2018-07-20T07:57:02Z","updated_at":"2018-07-20T07:57:02Z","author_association":"NONE","body":"Hi Nickliew,\r\n\r\nYou are right. I verify it just now and I am able to see the fonIcon icon even with bundle build. \r\n\r\nThanks so much for quick response.\r\n\r\nConfirm that the issue is resolved."}}
{"actor":{"display_login":"samliaw"}}