Failed to compile error when running on dev server locally after changing App.css in freshly created project

[j0214ack]

After freshly run create-react-app demo
cd ./demo
npm start

Then modify App.css.

Console shows

Failed to compile.

Error in ./src/App.js
Module not found: Error: Cannot resolve module 'react-native-web' in /Users/jack/workspace/js/react/demo/src
 @ ./src/App.js 7:19-42

And my App.js mysteriously becomes

import React, {StyleSheet, Dimensions, PixelRatio} from "react-native";
const {width, height, scale} = Dimensions.get("window"),
 vw = width / 100,
 vh = height / 100,
 vmin = Math.min(vw, vh),
 vmax = Math.max(vw, vh);

export default StyleSheet.create({
 "App": {
 "textAlign": "center"
 },
 "App-logo": {
 "animation": "App-logo-spin infinite 20s linear",
 "height": 80
 },
 "App-header": {
 "backgroundColor": "#222",
 "height": 150,
 "paddingTop": 20,
 "paddingRight": 20,
 "paddingBottom": 20,
 "paddingLeft": 20,
 "color": "red"
 },
 "App-intro": {
 "fontSize": "large"
 }
});

Using create-react-app v0.3.0
(This persists after I updated react-scripts to v0.4.1)

[j0214ack]

And I tried the same thing after I installed react-native-web
npm install --save-dev react-native-web

The console now shows the following instead

Compiled with warnings.

Warning in ./src/App.js

/Users/jack/workspace/js/react/demo/src/App.js
 1:8 warning 'React' is defined but never used no-unused-vars
 1:40 warning 'PixelRatio' is defined but never used no-unused-vars
 2:23 warning 'scale' is defined but never used no-unused-vars
 5:5 warning 'vmin' is defined but never used no-unused-vars
 6:5 warning 'vmax' is defined but never used no-unused-vars

✖ 5 problems (0 errors, 5 warnings)


You may use special comments to disable some warnings.
Use // eslint-disable-next-line to ignore the next line.
Use /* eslint-disable */ to ignore all warnings in a file.

[gaearon]

Please see #518.

You are using an Atom plugin that creates JS files based on your CSS source code.
Those files get picked up by the module system over your CSS files.

Disable it, and you won’t have this issue.

(And no, you don’t need to install react-native-web.)

[quadsurf]

@gaearon

I disabled that Atom plug-in, but the problem still persists... in fact, I went ahead and disabled just about every other Atom plug-in to see if that would solve the issue, but no luck. Please help!

[gaearon]

@quadsurf

Try another editor. If it helps then the problem is somehow in Atom.
Create React App won’t modify your source files by itself.