ionic-team / ionic-app-scripts

App Build Scripts for Ionic Projects
http://ionicframework.com/
MIT License
608 stars 304 forks source link

Latest ionic-app-scripts version 3.1.4 not identifying NODE_ENV #1404

Open raajmayukh opened 6 years ago

raajmayukh commented 6 years ago

I'm submitting a bug report

Current behavior: I was using Ionic app scripts 1.0.4 for my Angular 4 apps and it was able to identify the NODE_ENV set on Mac Command line; NODE_ENV=prod ionic cordova run android

But with the latest Angular version of 5.0.3 i am using 3.1.4. With this version of app scripts or even with 3.1.8 NODE_ENV always shows as undefined but if i go back to 2.1.4 it identifies the correct NODE_ENV as prod.

Expected behaviour: It should be able to identify the environment set through NODE_ENV

Related code: Note: One change between Angular 4 and 5 is, now i am using InjectionToken instead of earlier OpaqueToken.

import { InjectionToken } from "@angular/core"; export let EnvVariables = new InjectionToken("env.variables"); Here is my package.json file

{ "name": "xxxxxx", "version": "0.0.1", "author": "xxxxxx", "homepage": "xxxxxx", "private": true, "scripts": { "clean": "ionic-app-scripts clean", "build": "ionic-app-scripts build", "lint": "ionic-app-scripts lint", "ionic:build": "ionic-app-scripts build", "ionic:serve": "ionic-app-scripts serve" }, "dependencies": { "@angular/cli": "^1.7.0", "@angular/common": "5.0.3", "@angular/compiler": "5.0.3", "@angular/compiler-cli": "5.0.3", "@angular/core": "5.0.3", "@angular/forms": "5.0.3", "@angular/http": "5.0.3", "@angular/platform-browser": "5.0.3", "@angular/platform-browser-dynamic": "5.0.3", "@ionic-native/core": "4.4.0", "@ionic-native/splash-screen": "4.4.0", "@ionic-native/status-bar": "4.4.0", "@ionic/storage": "2.1.3", "cordova-android": "^6.2.3", "cordova-plugin-console": "1.0.5", "cordova-plugin-device": "1.1.4", "cordova-plugin-splashscreen": "~4.0.1", "cordova-plugin-statusbar": "2.2.2", "cordova-plugin-whitelist": "1.3.1", "intl": "^1.2.5", "ion2-calendar": "^2.1.6-beta.2", "ionic-angular": "3.9.2", "ionic-native": "^2.9.0", "ionic-plugin-keyboard": "~2.2.1", "ionicons": "3.0.0", "moment": "^2.20.1", "rxjs": "5.5.2", "sw-toolbox": "3.6.0", "zone.js": "0.8.18" }, "devDependencies": { "@angular/router": "4.0.2", "@ionic/app-scripts": "3.1.4", "@ionic/cli-plugin-cordova": "1.2.1", "@types/jasmine": "^2.8.6", "@types/node": "^9.4.6", "jasmine": "^3.0.0", "jasmine-core": "^2.99.1", "karma": "^2.0.0", "karma-chrome-launcher": "^2.2.0", "karma-cli": "^1.0.1", "karma-coverage-istanbul-reporter": "^1.4.1", "karma-jasmine": "^1.1.1", "karma-jasmine-html-reporter": "^0.2.2", "karma-junit-reporter": "^1.2.0", "karma-phantomjs-launcher": "^1.0.4", "typescript": "2.4.2" }, "cordovaPlugins": [ "cordova-plugin-whitelist", "cordova-plugin-console", "cordova-plugin-statusbar", "cordova-plugin-device", "cordova-plugin-splashscreen", "ionic-plugin-keyboard" ], "description": "xxxxxxx", "cordova": { "plugins": { "cordova-plugin-console": {}, "cordova-plugin-device": {}, "cordova-plugin-splashscreen": {}, "cordova-plugin-statusbar": {}, "cordova-plugin-whitelist": {}, "ionic-plugin-keyboard": {}, "cordova-plugin-dialogs": {} }, "platforms": [ "android" ] }, "config": { "ionic_webpack": "./webpack.config.js" } }

And here is my Webpack.config file:

var path = require('path'); var webpack = require('webpack'); var ionicWebpackFactory = require(process.env.IONIC_WEBPACK_FACTORY);

module.exports = { entry: process.env.IONIC_APP_ENTRY_POINT, output: { path: '{{BUILD}}', publicPath: 'build/', filename: process.env.IONIC_OUTPUT_JS_FILE_NAME, devtoolModuleFilenameTemplate: ionicWebpackFactory.getSourceMapperFunction(), }, devtool: process.env.IONIC_SOURCE_MAP_TYPE,

resolve: {
    extensions: ['.ts', '.js', '.json'],
    modules: [path.resolve('node_modules')]
},

module: {
    loaders: [{
            test: /\.json$/,
            loader: 'json-loader'
        },
        {
            test: /\.ts$/,
            loader: process.env.IONIC_WEBPACK_LOADER
        },
        {
            test: /\.js$/,
            loader: process.env.IONIC_WEBPACK_TRANSPILE_LOADER
        }
    ]
},
plugins: [
    ionicWebpackFactory.getIonicEnvironmentPlugin(),
    new webpack.EnvironmentPlugin(['NODE_ENV'])
],
// Some libraries import Node modules but don't use them in the browser.
// Tell Webpack to provide empty mocks for them so importing them works.
node: {
    fs: 'empty',
    net: 'empty',
    tls: 'empty'
}

}; Other information: Asked the question in SO earlier but couldn't get a response. https://stackoverflow.com/questions/49179750/latest-stable-ionic-app-scripts-version3-1-4-not-identifying-node-env-from-web

Ionic info: (run ionic info from a terminal/cmd prompt and paste output below):

cli packages: (/usr/local/lib/node_modules)

@ionic/cli-utils  : 1.18.0
ionic (Ionic CLI) : 3.18.0

global packages:

cordova (Cordova CLI) : 6.5.0

local packages:

@ionic/app-scripts : 3.1.4
Cordova Platforms  : android 6.1.2
Ionic Framework    : ionic-angular 3.9.2

System:

Android SDK Tools : 24.4.1
Node              : v7.10.0
npm               : 5.1.0
OS                : macOS Sierra
Xcode             : Xcode 8.1 Build version 8B62

Environment Variables:

ANDROID_HOME : xxxx(Have hidden it intentionally)

Misc: backend : pro

rejj commented 6 years ago

I have run in to exactly this same issue, can confirm this is happening.

Any possible resolution?