title: React-Native-Web configuration issue: Module not found: Error: Can't resolve 'react-native-screens'
body: <p>I'm trying to render a react native app for web using react-native-web, babel, and webpack.
  When I start webpack, I get the error below.
  As you can see from my web.config.js, I'm included the react native modules I need for rendering the custom react native code. 
  The react-native-screens module is installed, as you can see from the package.json.</p>
  
  <p>My question why the compiler is complaining about the react-native-screens dependency in the node_modules/react-navigation-stack/dist/views/StackView/StackViewCard.js if that module is installed?</p>
  
  <p>Any pointers appreciated.</p>
  
  <p><strong>error:</strong>
      ERROR in ./node_modules/react-navigation-stack/dist/views/StackView/StackViewCard.js
      Module not found: Error: Can't resolve 'react-native-screens' in '~/ReactNative/RNProto1/node_modules/react-navigation-stack/dist/views/StackView'
       @ ./node_modules/react-navigation-stack/dist/views/StackView/StackViewCard.js 1:931-962
       @ ./node_modules/react-navigation-stack/dist/index.js
       @ ./node_modules/react-navigation/src/react-navigation.js
       @ ./mydemo/demo.js
       @ ./index.web.js</p>
  
  <p><strong>babel.config.js:</strong></p>
  
  <pre><code>module.exports = {
    presets: ["@babel/env", "module:metro-react-native-babel-preset"],
    plugins: []
  };
  </code></pre>
  
  <p><strong>package.json:</strong></p>
  
  <pre><code>{
    "name": "react-native-demo",
    "dependencies": {
      "babel-cli": "^6.26.0",
      "dayjs": "^1.8.5",
      "lodash": "^4",
      "prop-types": "^15.6.0",
      "react-native-linear-gradient": "2.5.6",
      "react-native-screens": "^1.0.0-alpha.23",
      "react-native-svg": "9.8.4"
    },
    "devDependencies": {
      "@babel/cli": "^7.8.3",
      "@babel/core": "^7.8.3",
      "@babel/preset-env": "^7.8.3",
      "@babel/preset-react": "^7.8.0",
      "@babel/runtime": "^7.4.3",
      "@commitlint/cli": "^7.1.1",
      "@commitlint/config-conventional": "^7.1.1",
      "@semantic-release/changelog": "^2.0.2",
      "@semantic-release/git": "^5.0.0",
      "acorn": "6.3.0",
      "babel-core": "^6.26.0",
      "babel-eslint": "^10.0.1",
      "babel-jest": "^24.7.1",
      "babel-loader": "^8.0.6",
      "babel-plugin-react-docgen": "^3.2.0",
      "babel-preset-env": "^1.6.1",
      "css-loader": "0.28.11",
      "eslint-plugin-flowtype": "^2.50.3",
      "file-loader": "^4.2.0",
      "flow-bin": "^0.92.0",
      "glob": "^7.1.2",
      "html-webpack-plugin": "^3.2.0",
      "husky": "^0.14.3",
      "image-size": "^0.6.2",
      "imagemin": "^5.3.1",
      "jest": "^24.7.1",
      "metro-react-native-babel-preset": "^0.56.4",
      "mkdirp": "^0.5.1",
      "npm-run-all": "^4.1.2",
      "react": "16.8.3",
      "react-art": "^16.12.0",
      "react-dom": "^16.12.0",
      "react-native": "^0.59.4",
      "react-native-web": "^0.11.7",
      "react-navigation": "^2.18.3",
      "react-styleguidist": "^10.2.1",
      "react-test-renderer": "16.8.3",
      "semantic-release": "^15.4.1",
      "standard": "^12.0.1",
      "style-loader": "0.23.1",
      "svgexport": "^0.3.2",
      "url-loader": "^1.0.1",
      "webpack": "^4.41.5",
      "webpack-cli": "^3.3.10",
      "webpack-dev-server": "^3.10.1",
      "webpack-node-externals": "^1.7.2"
    },
    "peerDependencies": {
      "react": "16.3.1 || 16.4.1 || 16.8.3 || 16.8.6",
      "react-native": "^0.55.4 || ^0.56.0 || ^0.59.0 || ^0.60.5"
    }
  }
  </code></pre>
  
  <p><strong>web.config.js:</strong></p>
  
  <pre><code>const fs = require('fs');
  const isDev = true;
  const path = require('path');
  const webpack = require('webpack');
  var nodeExternals = require('webpack-node-externals');
  module.exports = {
    entry: './index.web.js',
    output: {
        path: path.join(__dirname, '/web'),
        filename: "bundle.js",
        publicPath: '/'
    },
    devServer: {
        inline: false,
        contentBase: path.join(__dirname, '/web'),
    },
    resolve: {
      alias: {
        'react-native': 'react-native-web'
      },
      // Resolve to iOS-specific components
      extensions: ['.ios.js', '.android.js', '.js', '.json']
    },
    target: 'node', // in order to ignore built-in modules like path, fs, etc. 
    module: {
      rules: [
        // Babel loader config
        {
          test: /\.js$/,
          loader: 'babel-loader',
          include: [
            path.join(__dirname, '/index.web.js'),
            path.join(__dirname, '/app'),
            path.join(__dirname, '/demo'),
            path.join(__dirname, '/src'),
            path.join(__dirname, '/node_modules/react-native-dismiss-keyboard'),
            path.join(__dirname, '/node_modules/react-native-drawer-layout'),
            path.join(__dirname, '/node_modules/react-native-drawer-layout-polyfill'),
            path.join(__dirname, '/node_modules/react-native-linear-gradient'),
            path.join(__dirname, '/node_modules/react-native-safe-area-view'),
            path.join(__dirname, '/node_modules/react-native-screens'),
            path.join(__dirname, '/node_modules/react-native-svg'),
            path.join(__dirname, '/node_modules/react-native-tab-view'),
            path.join(__dirname, '/node_modules/react-navigation'),
            path.join(__dirname, '/node_modules/react-navigation-deprecated-tab-navigator'),
            path.join(__dirname, '/node_modules/react-navigation-drawer'),
            path.join(__dirname, '/node_modules/react-navigation-stack'),
            path.join(__dirname, '/node_modules/react-navigation-tabs')
          ],
          options: {
            plugins: [
            ],
            presets: ['@babel/env', 'module:metro-react-native-babel-preset'],
            babelrc: false
          }  
        },
        // Image loader config
        {
          test: /\.(gif|jpe?g|png|svg)$/,
          use: {
            loader: 'url-loader',
            options: {
              name: '[name].[ext]'
            }
          }
        }, 
        // CSS loader config
        {
          test: /\.css$/,
          use: ['style-loader', 'css-loader']
        }
      ]
    }
  };
  </code></pre>