Webpack2 Ошибка - модуль не найден

Question

Я получаю эту ошибку:

ERROR in ./~/react/react.js 
Module not found: Error: Can't resolve './lib/React' in '/var/www/homelyfe/hl-app/node_modules/react' 
@ ./~/react/react.js 3:17-39 
@ ./app/index.js 

ERROR in ./~/react-dom/index.js 
Module not found: Error: Can't resolve './lib/ReactDOM' in '/var/www/homelyfe/hl-app/node_modules/react-dom' 
@ ./~/react-dom/index.js 3:17-42 
@ ./app/index.js 

В моей index.js (который webpack2, кажется, подбирая правильно), когда я

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

я получаю выше ошибка. Кажется, webpack не может найти ответ. Я отреагировал & зависимостей реагирования, установленных в package.json.

Мои webpack.config.js является:

const path = require("path"); 
const merge = require("webpack-merge"); 
const parts = require("./webpack.config.parts"); 
const PATHS = { 
    app : path.join(__dirname, "app"), 
    build : path.join(__dirname, "build") 
};  
const common = { 
    entry : { 
     app : "./app/index.js" 
    }, 
    output : { 
     filename : "run.build.js", 
     path : PATHS.build 
    }, 
    resolve : { 
     alias : { 
     assets : path.resolve(__dirname, "app/assets"), 
     components : path.resolve(__dirname, "app/components") 
     }, 
     extensions : [ "js", "jsx" ] 
    } 
}; 
var config; 
switch(process.env.npm_lifecycle_event){ 
    case("build-Prod"): { 
    ... 
    } 
    case("start-Dev"): 
    default: { 
     const eslintPath = path.join(__dirname, "/.eslintrc"); 
     config = merge(common, 
             parts.eslint(PATHS.app, eslintPath), 
             parts.babel(PATHS.app), 
             parts.devServer(PATHS.app), 
             parts.htmlWebpackPlugin()); 
    } 
} 
module.exports = config; 

Файл webpack.config.parts является:

const webpack = require("webpack"); 
const HtmlWebpackPlugin = require("html-webpack-plugin"); 
exports.babel = function(path){ 
    var standardPresets = [ 
          "react", 
          "es2015" 
    ]; 
    var presets; 
     presets = standardPresets; 
    } 
    return({ 
     module: { 
      rules : [ 
       { 
        test : /\.jsx?$/, 
      include : path, 
        use : [ 
         { 
          loader: "babel-loader", 
          options : { 
           presets 
          } 
         } 
        ] 
       } 
      ] 
     } 
    }); 
}; 

exports.devServer = function() { 
    return ({ 
    devServer: { 
     historyApiFallback: true, 
     hot: true, 
     inline: true, 
     stats: "errors-only" 
    }, 
    plugins: [ 
     new webpack.HotModuleReplacementPlugin({ 
     multiStep: true 
     }) 
    ] 
    }); 
}; 
exports.eslint = function(path, configFilePath){ 
    return ({ 
    module: { 
     rules : [ 
      { 
       test : /\.jsx?$/, 
       enforce : "pre", 
     include : path, 
       use : [ 
        { 
         loader : "eslint-loader", 
         options : { 
          configFile : configFilePath 
         } 
        } 
       ] 
      } 
     ] 
    } 
    }); 
}; 
exports.htmlWebpackPlugin = function() { 
    return ({ 
    plugins: [ 
     new HtmlWebpackPlugin({ 
     title: "title" 
     }) 
    ] 
    }); 
}; 

Answer 1

Я имел ту же ошибку несколько минут назад. После того, как я много времени ждал, я нашел решение.

В вашем resolve.extensions обратите внимание, что расширения включают в себя ведущие точки. Таким образом, вам необходимо заменить его на следующее:

extensions : [ ".js", ".jsx" ] 

Изменение этой проблемы должно быть исправлено.