Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

react-scripts-build => 'navigator is not defined'

See original GitHub issue

Attempting to build & deploy to gh-pages, but it’s failing at ‘react-scripts-build’, throwing ‘Module build failed: ReferenceError: navigator is not defined’. It appears to be coming from App.css, but I can’t find what ‘navigator’ is referring to in the first place. Do you know what ‘navigator’ refers to and what could be causing this?

Here’s the commit of the project at this point: https://github.com/ztotta/Portfolio/commit/e7ec3e6abc19bb9f6761aa755287b4db0d8aa195

And here’s the log:

react-scripts build

Creating an optimized production build...
Failed to compile.

**Module build failed: ReferenceError: navigator is not defined**
    at Object.module.exports.e.__esModule.default (/Users/mac/programming-projects/Portfolio/node_modules/css-loader/index.js?importLoaders=1!/Users/mac/programming-projects/Portfolio/node_modules/postcss-loader/index.js!/Users/mac/programming-projects/Portfolio/src/App.css:35005:25079)
    at t (/Users/mac/programming-projects/Portfolio/node_modules/css-loader/index.js?importLoaders=1!/Users/mac/programming-projects/Portfolio/node_modules/postcss-loader/index.js!/Users/mac/programming-projects/Portfolio/src/App.css:35004:122)
    at Object.<anonymous> (/Users/mac/programming-projects/Portfolio/node_modules/css-loader/index.js?importLoaders=1!/Users/mac/programming-projects/Portfolio/node_modules/postcss-loader/index.js!/Users/mac/programming-projects/Portfolio/src/App.css:35005:29200)
    at t (/Users/mac/programming-projects/Portfolio/node_modules/css-loader/index.js?importLoaders=1!/Users/mac/programming-projects/Portfolio/node_modules/postcss-loader/index.js!/Users/mac/programming-projects/Portfolio/src/App.css:35004:122)
    at Object.<anonymous> (/Users/mac/programming-projects/Portfolio/node_modules/css-loader/index.js?importLoaders=1!/Users/mac/programming-projects/Portfolio/node_modules/postcss-loader/index.js!/Users/mac/programming-projects/Portfolio/src/App.css:35004:513)
    at t (/Users/mac/programming-projects/Portfolio/node_modules/css-loader/index.js?importLoaders=1!/Users/mac/programming-projects/Portfolio/node_modules/postcss-loader/index.js!/Users/mac/programming-projects/Portfolio/src/App.css:35004:122)
    at /Users/mac/programming-projects/Portfolio/node_modules/css-loader/index.js?importLoaders=1!/Users/mac/programming-projects/Portfolio/node_modules/postcss-loader/index.js!/Users/mac/programming-projects/Portfolio/src/App.css:35004:210
    at Object.<anonymous> (/Users/mac/programming-projects/Portfolio/node_modules/css-loader/index.js?importLoaders=1!/Users/mac/programming-projects/Portfolio/node_modules/postcss-loader/index.js!/Users/mac/programming-projects/Portfolio/src/App.css:35004:215)
    at __webpack_require__ (/Users/mac/programming-projects/Portfolio/node_modules/css-loader/index.js?importLoaders=1!/Users/mac/programming-projects/Portfolio/node_modules/postcss-loader/index.js!/Users/mac/programming-projects/Portfolio/src/App.css:21:30)
    at Object.<anonymous> (/Users/mac/programming-projects/Portfolio/node_modules/css-loader/index.js?importLoaders=1!/Users/mac/programming-projects/Portfolio/node_modules/postcss-loader/index.js!/Users/mac/programming-projects/Portfolio/src/App.css:35014:19)
    at __webpack_require__ (/Users/mac/programming-projects/Portfolio/node_modules/css-loader/index.js?importLoaders=1!/Users/mac/programming-projects/Portfolio/node_modules/postcss-loader/index.js!/Users/mac/programming-projects/Portfolio/src/App.css:21:30)
    at Object.<anonymous> (/Users/mac/programming-projects/Portfolio/node_modules/css-loader/index.js?importLoaders=1!/Users/mac/programming-projects/Portfolio/node_modules/postcss-loader/index.js!/Users/mac/programming-projects/Portfolio/src/App.css:37709:32)
    at __webpack_require__ (/Users/mac/programming-projects/Portfolio/node_modules/css-loader/index.js?importLoaders=1!/Users/mac/programming-projects/Portfolio/node_modules/postcss-loader/index.js!/Users/mac/programming-projects/Portfolio/src/App.css:21:30)
    at Object.module.exports.Object.defineProperty.value (/Users/mac/programming-projects/Portfolio/node_modules/css-loader/index.js?importLoaders=1!/Users/mac/programming-projects/Portfolio/node_modules/postcss-loader/index.js!/Users/mac/programming-projects/Portfolio/src/App.css:37077:23)
    at __webpack_require__ (/Users/mac/programming-projects/Portfolio/node_modules/css-loader/index.js?importLoaders=1!/Users/mac/programming-projects/Portfolio/node_modules/postcss-loader/index.js!/Users/mac/programming-projects/Portfolio/src/App.css:21:30)
    at Object.module.exports.Object.defineProperty.value (/Users/mac/programming-projects/Portfolio/node_modules/css-loader/index.js?importLoaders=1!/Users/mac/programming-projects/Portfolio/node_modules/postcss-loader/index.js!/Users/mac/programming-projects/Portfolio/src/App.css:37834:13)

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! Portfolio@0.1.0 build: `react-scripts build`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the Portfolio@0.1.0 build script 'react-scripts build'.```

Issue Analytics

State:
Created 7 years ago
Comments:8 (7 by maintainers)

Top GitHub Comments

1reaction

darrenscerricommented, Mar 22, 2017

Thought this issue was fixed for Webpack ^2.1.0 but apparently this is only fixed for specific require calls. css-loader and extract-text-webpack-plugin both seem to have related issues. Filed issues here:

https://github.com/webpack/webpack/issues/4541 https://github.com/webpack-contrib/css-loader/issues/462 https://github.com/webpack-contrib/extract-text-webpack-plugin/issues/465

This is a repo that reproduces these issues: https://github.com/darrenscerri/webpack-extract-text-plugin-empty-require-error

0reactions

gaearoncommented, Mar 22, 2017

Cool, I’ll close our issue then. Thanks for following up.

Top Results From Across the Web

Mocha + React: navigator is not defined - Stack Overflow

I'm trying to write the first test for React components and keep getting error: ReferenceError: navigator is not defined.

navigator is not defined react - You.com | The AI Search ...

Attempting to build & deploy to gh-pages, but it's failing at 'react-scripts-build', throwing 'Module build failed: ReferenceError: navigator is not defined'.

Navigator is not defined----bug - Theia Community

navigator is a browser API. If you require code in the backend that ends up executing browser scripts you will get errors.

Migrating from Create React App - Next.js

js related commands to scripts . One is next dev , which runs a development server at localhost:3000 . You should also add...

Use Mapbox GL JS in a React app | Help

React is a popular JavaScript library used for building user interfaces. ... App.js : This JavaScript file will set up the React app....