Here an example is given how to import certain classes from a module:

import {ModalContainer, ModalDialog} from 'react-modal-dialog';

However, PhpStorm (latest EAP) gives me an error:

I installed the package with npm install react-modal-dialog and it is present in node_modules.

The equivalent var {ModalContainer, ModalDialog} = require('react-modal-dialog'); works fine.

Here an example is given how to import certain classes from a module:

import {ModalContainer, ModalDialog} from 'react-modal-dialog';

However, PhpStorm (latest EAP) gives me an error:

I installed the package with npm install react-modal-dialog and it is present in node_modules.

The equivalent var {ModalContainer, ModalDialog} = require('react-modal-dialog'); works fine.

• javascript
• ecmascript-6
• phpstorm
• webstorm
• commonjs

• 1 Have you set the js language version to ECMA script harmony? – winhowes Commented Mar 2, 2016 at 8:30
• Are you transpiling the code before executing it? – Mulan Commented Mar 2, 2016 at 8:41
• 2 @winhowes Yes, happens in both "ECMAScript 6" and "JSX Harmony" mode. – AndreKR Commented Mar 2, 2016 at 13:02
• I think destructuring doesn't work with import. I have to do import React from 'react-native'; and then var { Text, View } = React to workaround the warning. – Sam Commented Mar 3, 2016 at 8:29
• It's not destructuring (at least it's not meant to be), it's the import syntax: "Import multiple members of a module. This inserts both foo and bar into the current scope." – AndreKR Commented Mar 3, 2016 at 9:42

2 Answers 2

I encountered this when setting up a React project and all i did was download the import's typescript definition, in my case just searched for react.

Instructions for adding libraries to your project can be found on webstorm's help page.

I think it caused by PHPStorm. The IDE can't understand the import syntax when import a CommonJS module.

I got this warning when using WebStorm 2016.1.2, too.

Taking react and react-router as example:

• react is a CommonJS module, developed with ES5 syntax;
• react-router is developed with ES2015 syntax, and compiled by Babel.

WebStorm 2016.1.2 can resolve Link exported by react-router module, but can't resolve createClass exported by react module.

Update:

browser-sync is a CommonJS module developed with ES5, too. But it works well on WebStorm, WebStorm can resolve all API exported by browser-sync.

It baffled me that WebStorm can't resolve react exported API.