Webpack 找不到模块的问题求助

#1

那个那个，看到最近 react 发展越发成熟了。 于是小生也开始蠢蠢欲动，便想试着用用写点小东西玩玩。 然而没想到出师未捷居然死在了 webpack 这一步。(:з」∠) 不知道为何每次编译都说找不到 react 和 react-dom 求各位菊苣帮助的说……

package 如下

"devDependencies": {
    "babel-core": "^6.7.7",
    "babel-loader": "^6.2.4",
    "babel-preset-es2015": "^6.6.0",
    "babel-preset-react": "^6.5.0",
    "css-loader": "^0.23.1",
    "react-hot-loader": "^1.3.0",
    "redux-logger": "^2.6.1",
    "style-loader": "^0.13.1",
    "stylus": "^0.54.5",
    "stylus-loader": "^2.0.0",
    "webpack": "^1.13.0"
},
"dependencies": {
    "react": "^15.0.2",
    "react-dom": "^15.0.2",
    "react-redux": "^4.4.5",
    "redux": "^3.5.2"
}

然后是 webpack 的配置：

var path = require('path')

module.exports = {
    entry: './entry.js',
    output: {
        path: path.join(__dirname, '/dist'),
        filename: 'bundle.js'
    },
    resolve: {
        extensions: ['','js','jsx','styl']
    },
    module: {
        loaders: [
            {
                test: /\.js|jsx$/,
                loader: 'babel',
                query:{
                    presets:['es2015','react']
                }
            },
            {
                test: /\.styl$/,
                loader: 'style!css!stylus'
            }
        ]
    }
}

窝这边大概是通过以下方法引入 react 模块，难道不可以么？？？ QAQ

import React from 'react';
import { render } from 'react-dom';

运行 webpack --display-error-details 返回以下信息：

ERROR in ./~/react-dom/index.js
Module not found: Error: Cannot resolve module 'react/lib/ReactDOM' in /Users/ZZZero/rainToDo/node_modules/react-dom
resolve module react/lib/ReactDOM in /Users/ZZZero/rainToDo/node_modules/react-dom
  looking for modules in /Users/ZZZero/rainToDo/node_modules
    resolve 'file' or 'directory' lib/ReactDOM in /Users/ZZZero/rainToDo/node_modules/react
      resolve file
        /Users/ZZZero/rainToDo/node_modules/react/lib/ReactDOM doesn't exist
        /Users/ZZZero/rainToDo/node_modules/react/lib/ReactDOMjs doesn't exist
        /Users/ZZZero/rainToDo/node_modules/react/lib/ReactDOMjsx doesn't exist
        /Users/ZZZero/rainToDo/node_modules/react/lib/ReactDOMstyl doesn't exist
      resolve directory
        /Users/ZZZero/rainToDo/node_modules/react/lib/ReactDOM doesn't exist (directory default file)
        /Users/ZZZero/rainToDo/node_modules/react/lib/ReactDOM/package.json doesn't exist (directory description file)
[/Users/ZZZero/rainToDo/node_modules/react/lib/ReactDOM]
[/Users/ZZZero/rainToDo/node_modules/react/lib/ReactDOMjs]
[/Users/ZZZero/rainToDo/node_modules/react/lib/ReactDOMjsx]
[/Users/ZZZero/rainToDo/node_modules/react/lib/ReactDOMstyl]
 @ ./~/react-dom/index.js 3:17-46

ERROR in ./~/react/react.js
Module not found: Error: Cannot resolve 'file' or 'directory' ./lib/React in /Users/ZZZero/rainToDo/node_modules/react
resolve file
  /Users/ZZZero/rainToDo/node_modules/react/lib/React doesn't exist
  /Users/ZZZero/rainToDo/node_modules/react/lib/Reactjs doesn't exist
  /Users/ZZZero/rainToDo/node_modules/react/lib/Reactjsx doesn't exist
  /Users/ZZZero/rainToDo/node_modules/react/lib/Reactstyl doesn't exist
resolve directory
  /Users/ZZZero/rainToDo/node_modules/react/lib/React doesn't exist (directory default file)
  /Users/ZZZero/rainToDo/node_modules/react/lib/React/package.json doesn't exist (directory description file)
[/Users/ZZZero/rainToDo/node_modules/react/lib/React]
[/Users/ZZZero/rainToDo/node_modules/react/lib/Reactjs]
[/Users/ZZZero/rainToDo/node_modules/react/lib/Reactjsx]
[/Users/ZZZero/rainToDo/node_modules/react/lib/Reactstyl]
 @ ./~/react/react.js 3:17-39
#2

贴点源代码呢，是不是源代码中哪里用了ReactDOM，并没有引入ReactDOM。

#3

你的 webpack 配置文件写的有问题, resolve 里的拓展名都少了一个 . 号, 这样webpack就找不到对应文件了, 你看到报错中 webpack 企图找到 ReactDOM/ ReactDOMjs /ReactDOMjsx 等等, 都少了个 . 号

1 Like
#4

@cxxsn @theJian thx 这里已解决 添加了以下配置就好了
resolve: { fallback: path.join(__dirname, “node_modules”) },
resolveLoader: { root: path.join(__dirname, “node_modules”) }

https://webpack.github.io/docs/configuration.html#module-loaders

#5

遇到同样的问题，确实是resolve少了个.号，网上webpack配置教程的坑