Uncaught ReferenceError: process is not defined

Ionic Framework ionic-v3
1

Hi,

we are using redux in our app. I am trying to migrate from beta11 to rc0. Problem is that in redux is sometring like this:

if (process.env.NODE_ENV !== ‘production’ && typeof isCrushed.name === ‘string’ && isCrushed.name !== ‘isCrushed’) {
warning('You are currently using minified code outside of NODE_ENV === ‘production’. '…
}

but process not defined in browser. ionic serve command builds everything successfully.

Any help please?

2

Hi,
I had the same error. Did you find any solution?

3

Yes, I created process object with specified properties in index.html as workaround.

4

It worked fine,
Thank you,

5

I’m having the same problem but I don’t understand what you did. You changed /src/index.html and added a script to it? What did you put in it?

6

I created there global object. Something like this:

process = { env: { NODE_ENV: ‘development’} };

7

Thanks!

I did this and it was working with ionic serve:

<script>
  var process = {env : {NODE_ENV: 'production'}}
</script>

Are you guys able to build on device? I’m trying to build for android but failing too. Not working :confused:

8

yes, we are building and running app on device without any problem. What exactly is your problem with build?

9

I’ve created from the new starter project so the html script is no longer required. It has an updated version of “@ionic/app-scripts”

But I’m still not able to build for device. ionic serve works fine.
I’ve tried to reproduce the error from a minimum starter tab template with redux and redux-thunk.

This is the error output I’m getting with npm run build

[19:25:46] ngc: Error: Error encountered resolving symbol values statically. Calling function ‘createStore’, function calls are not supported. Consider replacing the function or lambda with a reference to an exported function, resolving symbol AppModule in c:/Ionic/ionic-redux-test/.tmp/app/app.module.ts, resolving symbol AppModule in c:/Ionic/ionic-redux-test/.tmp/app/app.module.ts
at simplifyInContext (c:\Ionic\ionic-redux-test\node_modules@angular\compiler-cli\src\static_reflector.js:469:23)
at StaticReflector.simplify (c:\Ionic\ionic-redux-test\node_modules@angular\compiler-cli\src\static_reflector.js:472:22)
at StaticReflector.annotations (c:\Ionic\ionic-redux-test\node_modules@angular\compiler-cli\src\static_reflector.js:61:36)
at _loop_1 (c:\Ionic\ionic-redux-test\node_modules@angular\compiler-cli\src\codegen.js:53:54)
at CodeGenerator.readFileMetadata (c:\Ionic\ionic-redux-test\node_modules@angular\compiler-cli\src\codegen.js:66:13)
at c:\Ionic\ionic-redux-test\node_modules@angular\compiler-cli\src\codegen.js:100:74
at Array.map (native)
at CodeGenerator.codegen (c:\Ionic\ionic-redux-test\node_modules@angular\compiler-cli\src\codegen.js:100:35)
at codegen (c:\Ionic\ionic-redux-test\node_modules@angular\compiler-cli\src\main.js:7:81)
at Object.main (c:\Ionic\ionic-redux-test\node_modules@angular\tsc-wrapped\src\main.js:30:16)

[19:25:46] ngc: Compilation failed

[19:25:46] ngc failed: NGC encountered an error
[19:25:46] Error: NGC encountered an error
at ChildProcess. (c:\Ionic\ionic-redux-test\node_modules@ionic\app-scripts\dist\ngc.js:62:24)
at emitTwo (events.js:87:13)
at ChildProcess.emit (events.js:172:7)
at ChildProcess.cp.emit (c:\Ionic\ionic-redux-test\node_modules\cross-spawn\lib\enoent.js:40:29)
at maybeClose (internal/child_process.js:821:16)
at Process.ChildProcess._handle.onexit (internal/child_process.js:211:5)
Error running ionic app script “build”: Error: NGC encountered an error

These are the changes I’m doing in app.module.ts, just before @NgModule. Are you doing the same thing?

//Redux - ReduxThunk - rootReducer
import { createStore, applyMiddleware } from 'redux';
import ReduxThunk  from 'redux-thunk';
import rootReducer from '../modules/rootReducer';

const appStore = createStore(
    rootReducer,
    applyMiddleware(ReduxThunk)
);

And adding this in the providers array:

providers: [
    { provide: 'AppStore', useValue: appStore }
]

How are you guys creating the store on your side?

10 
let store = createStore(rootReducer, applyMiddleware(<any>ReduxThunk));

@Injectable()
export class MyAppStore extends ReduxStore {
  constructor() {
    super(store);
  }
}




...
 providers: [MyAppStore],
...
11

I tried to create the store in an independent provider and then declaring it in the provider array in app.module.ts but was getting a reference error. There were some circular dependency between action creators calling the providers.

I was able to solve the problem today with this answer on stackoverflow. I’ve been stuck on it for over a week.

These are the changes, I made:

export function appStore() {
  return createStore(
    rootReducer,
    applyMiddleware(ReduxThunk)
  );
}

And adding this in the providers array:

  providers: [
    { provide: 'AppStore', useFactory: appStore }
  ]