生产中的 Webpack:为什么 React Native 错误?

问题描述

限时删除！！

我有一个安装了以下内容的测试应用:

I have a test app with the following installed:

"dependencies": {
  "express": "^4.14.0",
  "react": "^15.3.2",
  "react-dom": "^15.3.2"
},
"devDependencies": {
  "babel": "^6.5.2",
  "babel-core": "^6.18.2",
  "babel-loader": "^6.2.7",
  "babel-preset-es2015": "^6.18.0",
  "babel-preset-react": "^6.16.0",
  "webpack": "^1.13.3"
}

我的webpack.config.js:

module.exports = {
  entry: {
    'bundle': './client/index.js'
  },
  output: {
    path: './public',
    filename: 'js/[name].js'
  },
  plugins: [
    new webpack.ProvidePlugin({
      'process.env': {
        NODE_ENV: JSON.stringify('production')
      }
    })
  ],
  module: {
    loaders: [
      {
        test: /\.js$/,
        exclude: /(node_modules|bower_components)/,
        loader: 'babel-loader',
        query: { presets: ['es2015', 'react'] }
      }
    ]
  }
}

为什么我会收到这些 React Native 相关的错误..??我不是要使用 React Native！

Why do I get these React Native related errors..?? I'm not trying to use React Native!

(当我删除 webpack.ProvidePlugin() 时，错误消失了，但我需要 React 的生产版本).

(When I remove webpack.ProvidePlugin() the errors go away, but I need the production build of React).

./~/react/lib/NativeMethodsMixin.js 中的错误找不到模块:错误:无法解析 C:\node\sandbox\react-webpack\node_modules\react\lib 中的模块react-native/lib/TextInputState"@ ./~/react/lib/NativeMethodsMixin.js 17:21-63

./~/react/lib/NativeMethodsMixin.js 中的错误找不到模块:错误:无法解析 C:\node\sandbox\react-webpack\node_modules\react\lib 中的模块react-native/lib/UIManager"@ ./~/react/lib/NativeMethodsMixin.js 18:16-53

ERROR in ./~/react/lib/NativeMethodsMixin.js Module not found: Error: Cannot resolve module 'react-native/lib/UIManager' in C:\node\sandbox\react-webpack\node_modules\react\lib @ ./~/react/lib/NativeMethodsMixin.js 18:16-53

./~/react/lib/ReactNativeBaseComponent.js 中的错误找不到模块:错误:无法解析 C:\node\sandbox\react-webpack\node_modules\react\lib 中的模块react-native/lib/UIManager"@ ./~/react/lib/ReactNativeBaseComponent.js 22:16-53

ERROR in ./~/react/lib/ReactNativeBaseComponent.js Module not found: Error: Cannot resolve module 'react-native/lib/UIManager' in C:\node\sandbox\react-webpack\node_modules\react\lib @ ./~/react/lib/ReactNativeBaseComponent.js 22:16-53

./~/react/lib/ReactNativeBaseComponent.js 中的错误找不到模块:错误:无法解析 C:\node\sandbox\react-webpack\node_modules\react\lib 中的模块react-native/lib/deepFreezeAndThrowOnMutationInDev"@ ./~/react/lib/ReactNativeBaseComponent.js 24:40-101

ERROR in ./~/react/lib/ReactNativeBaseComponent.js Module not found: Error: Cannot resolve module 'react-native/lib/deepFreezeAndThrowOnMutationInDev' in C:\node\sandbox\react-webpack\node_modules\react\lib @ ./~/react/lib/ReactNativeBaseComponent.js 24:40-101

./~/react/lib/ReactNativeAttributePayload.js 中的错误找不到模块:错误:无法解析 C:\node\sandbox\react-webpack\node_modules\react\lib 中的模块react-native/lib/deepDiffer"@ ./~/react/lib/ReactNativeAttributePayload.js 16:17-55

ERROR in ./~/react/lib/ReactNativeAttributePayload.js Module not found: Error: Cannot resolve module 'react-native/lib/deepDiffer' in C:\node\sandbox\react-webpack\node_modules\react\lib @ ./~/react/lib/ReactNativeAttributePayload.js 16:17-55

./~/react/lib/ReactNativeAttributePayload.js 中的错误找不到模块:错误:无法解析 C:\node\sandbox\react-webpack\node_modules\react\lib 中的模块react-native/lib/flattenStyle"@ ./~/react/lib/ReactNativeAttributePayload.js 17:19-59

ERROR in ./~/react/lib/ReactNativeAttributePayload.js Module not found: Error: Cannot resolve module 'react-native/lib/flattenStyle' in C:\node\sandbox\react-webpack\node_modules\react\lib @ ./~/react/lib/ReactNativeAttributePayload.js 17:19-59

./~/react/lib/ReactNativeBridgeEventPlugin.js 中的错误找不到模块:错误:无法解析 C:\node\sandbox\react-webpack\node_modules\react\lib 中的模块react-native/lib/UIManager"@ ./~/react/lib/ReactNativeBridgeEventPlugin.js 20:16-53

ERROR in ./~/react/lib/ReactNativeBridgeEventPlugin.js Module not found: Error: Cannot resolve module 'react-native/lib/UIManager' in C:\node\sandbox\react-webpack\node_modules\react\lib @ ./~/react/lib/ReactNativeBridgeEventPlugin.js 20:16-53

./~/react/lib/ReactNativeDOMIDOperations.js 中的错误找不到模块:错误:无法解析 C:\node\sandbox\react-webpack\node_modules\react\lib 中的模块react-native/lib/UIManager"@ ./~/react/lib/ReactNativeDOMIDOperations.js 15:16-53

ERROR in ./~/react/lib/ReactNativeDOMIDOperations.js Module not found: Error: Cannot resolve module 'react-native/lib/UIManager' in C:\node\sandbox\react-webpack\node_modules\react\lib @ ./~/react/lib/ReactNativeDOMIDOperations.js 15:16-53

./~/react/lib/ReactNativeDefaultInjection.js 中的错误找不到模块:错误:无法解析 C:\node\sandbox\react-webpack\node_modules\react\lib 中的模块react-native/lib/InitializeJavaScriptAppEngine"@ ./~/react/lib/ReactNativeDefaultInjection.js 23:0-57

ERROR in ./~/react/lib/ReactNativeDefaultInjection.js Module not found: Error: Cannot resolve module 'react-native/lib/InitializeJavaScriptAppEngine' in C:\node\sandbox\react-webpack\node_modules\react\lib @ ./~/react/lib/ReactNativeDefaultInjection.js 23:0-57

./~/react/lib/ReactNativeDefaultInjection.js 中的错误找不到模块:错误:无法解析 C:\node\sandbox\react-webpack\node_modules\react\lib 中的模块react-native/lib/RCTEventEmitter"@ ./~/react/lib/ReactNativeDefaultInjection.js 27:22-65

ERROR in ./~/react/lib/ReactNativeDefaultInjection.js Module not found: Error: Cannot resolve module 'react-native/lib/RCTEventEmitter' in C:\node\sandbox\react-webpack\node_modules\react\lib @ ./~/react/lib/ReactNativeDefaultInjection.js 27:22-65

./~/react/lib/ReactNativeDefaultInjection.js 中的错误找不到模块:错误:无法解析 C:\node\sandbox\react-webpack\node_modules\react\lib 中的模块react-native/lib/View"@ ./~/react/lib/ReactNativeDefaultInjection.js 79:15-47

ERROR in ./~/react/lib/ReactNativeDefaultInjection.js Module not found: Error: Cannot resolve module 'react-native/lib/View' in C:\node\sandbox\react-webpack\node_modules\react\lib @ ./~/react/lib/ReactNativeDefaultInjection.js 79:15-47

./~/react/lib/ReactNativeGlobalResponderHandler.js 中的错误找不到模块:错误:无法解析 C:\node\sandbox\react-webpack\node_modules\react\lib 中的模块react-native/lib/UIManager"@ ./~/react/lib/ReactNativeGlobalResponderHandler.js 13:16-53

ERROR in ./~/react/lib/ReactNativeGlobalResponderHandler.js Module not found: Error: Cannot resolve module 'react-native/lib/UIManager' in C:\node\sandbox\react-webpack\node_modules\react\lib @ ./~/react/lib/ReactNativeGlobalResponderHandler.js 13:16-53

./~/react/lib/ReactNativeMount.js 中的错误找不到模块:错误:无法解析 C:\node\sandbox\react-webpack\node_modules\react\lib 中的模块react-native/lib/UIManager"@ ./~/react/lib/ReactNativeMount.js 21:16-53

ERROR in ./~/react/lib/ReactNativeMount.js Module not found: Error: Cannot resolve module 'react-native/lib/UIManager' in C:\node\sandbox\react-webpack\node_modules\react\lib @ ./~/react/lib/ReactNativeMount.js 21:16-53

./~/react/lib/ReactNativeTextComponent.js 中的错误找不到模块:错误:无法解析 C:\node\sandbox\react-webpack\node_modules\react\lib 中的模块react-native/lib/UIManager"@ ./~/react/lib/ReactNativeTextComponent.js 19:16-53

ERROR in ./~/react/lib/ReactNativeTextComponent.js Module not found: Error: Cannot resolve module 'react-native/lib/UIManager' in C:\node\sandbox\react-webpack\node_modules\react\lib @ ./~/react/lib/ReactNativeTextComponent.js 19:16-53

./~/react/lib/ReactDOMFiber.js 中的错误找不到模块:错误:无法解析 C:\node\sandbox\react-webpack\node_modules\react\lib 中的文件"或目录"./ReactFiberReconciler@ ./~/react/lib/ReactDOMFiber.js 15:27-60

ERROR in ./~/react/lib/ReactDOMFiber.js Module not found: Error: Cannot resolve 'file' or 'directory' ./ReactFiberReconciler in C:\node\sandbox\react-webpack\node_modules\react\lib @ ./~/react/lib/ReactDOMFiber.js 15:27-60

./~/react/lib/ReactNoop.js 中的错误找不到模块:错误:无法解析 C:\node\sandbox\react-webpack\node_modules\react\lib 中的文件"或目录"./ReactFiberReconciler@ ./~/react/lib/ReactNoop.js 22:27-60

ERROR in ./~/react/lib/ReactNoop.js Module not found: Error: Cannot resolve 'file' or 'directory' ./ReactFiberReconciler in C:\node\sandbox\react-webpack\node_modules\react\lib @ ./~/react/lib/ReactNoop.js 22:27-60

推荐答案

使用 DefinePlugin 而不是 ProvidePlugin.这是用于此用例的插件.

Use DefinePlugin Instead of ProvidePlugin. That's the plugin used for this use case.

我不明白是什么触发了这些错误.我认为 react 确实包含一些特定于 react-native 的代码.

I don't understand what triggered those errors though. I think react does contain some code that are specific to react-native.

这篇关于生产中的 Webpack:为什么 React Native 错误?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

1403页，肝出来的..