Модуль «Модуль отсутствующего модуля Webpack» не найден »

Question

В настоящее время я работаю над сайтом веб-сайта с веб-сайтом и пытаюсь построить его первый раз. Сборка выполнена успешно, но когда я открываю браузер, я получаю следующую ошибку:

Uncaught Error: Cannot find module "/Users/michael.nakayama/Documents/Development/jamsesh/node_modules/webpack/node_modules/node-libs-browser/node_modules/process/browser.js" 

Этот модуль существует. Переход к этому фактическому URL в моем браузере показывает файл, о котором идет речь. Но я не могу понять, почему веб-пакет не может его найти. Я не знаю, является ли это проблемой babel6 или проблемой веб-пакета, или нет. Мой конфигурационный файл выглядит следующим образом:

var webpack = require('webpack'); 
var cleanWebpack = require('clean-webpack-plugin'); 

var ignore = new webpack.IgnorePlugin(new RegExp("/(node_modules|ckeditor)/")) 

module.exports = { 
    devtool: 'inline-source-map', 
    entry: './lib/client/entry', 
    output: { 
    path: __dirname + '/public/js', 
    filename: 'app.js', 
    publicPath: 'http://localhost:8081/js/', 
    }, 
    plugins: [ 
    ignore, 
    ], 
    resolve: { 
    extensions: ['', '.js'], 
    moduleDirectories: ['./node_modules'] 
    }, 
    module: { 
    loaders: [ 
     { 
     test: /\.js?$/, 
     loaders: ['babel-loader?presets[]=react,presets[]=es2015,plugins[]=transform-es2015-classes,plugins[]=transform-react-jsx'], 
     exclude: /(node_modules)/, 
     } 
    ] 
    } 
} 

и мой файловый сервер WebPack выглядит следующим образом:

var WebpackDevServer = require('webpack-dev-server'); 

var webpack = require('webpack'); 
var config = require('../../webpack.config'); 

var server = new WebpackDevServer(webpack(config), { 
    // webpack-dev-server options 
    publicPath: config.output.publicPath, 
    stats: { colors: true }, 
}); 

server.listen(8081, 'localhost', function() {}); 

и вот пакеты Я установил:

"devDependencies": { 
    "babel-cli": "^6.3.17", 
    "babel-core": "^6.3.26", 
    "babel-loader": "^6.2.0", 
    "babel-plugin-syntax-jsx": "^6.3.13", 
    "babel-plugin-transform-es2015-classes": "^6.4.0", 
    "babel-plugin-transform-react-jsx": "^6.3.13", 
    "babel-preset-es2015": "^6.3.13", 
    "babel-preset-react": "^6.3.13", 
    "body-parser": "^1.14.2", 
    "clean-webpack-plugin": "^0.1.5", 
    "express": "^4.13.3", 
    "history": "^1.17.0", 
    "jade": "^1.11.0", 
    "nodemon": "^1.8.1", 
    "path": "^0.12.7", 
    "pg": "^4.4.3", 
    "react": "^0.14.6", 
    "react-dom": "^0.14.3", 
    "react-hot-loader": "^1.3.0", 
    "react-router": "^1.0.3", 
    "webpack": "^1.12.9", 
    "webpack-dev-server": "^1.14.0" 
    } 

entry.js:

var React = require('react'); 
var ReactDOM = require('react-dom'); 
var ReactRouter = require('react-router'); 
var Router = ReactRouter.Router; 
var Route = ReactRouter.Route; 
var routes = require('../routes'); 

// -v x.13.x 
/**Router.run(routes, Router.HistoryLocation, function (Handler, state) { 
    React.render(<Handler/>, document.getElementById('react-app')); 
});**/ 

var node = document.getElementById('react-app'); 
// -v 1.0.0 
ReactDOM.render(<Router history={createBrowserHistory()} routes={routes}/> , node); 

Также как голова, я попытался удалить и переустановить все мои пакеты. Я попытался установить специально модули узла-libs-браузера. Благодарю.

Answer 1

Проблема с игнорированием плагина на node_modules. В webpack.config.js, у вас есть:

var ignore = new webpack.IgnorePlugin(new RegExp("/(node_modules|ckeditor)/")) 
... 
plugins: [ 
    ignore, 
], 

От Ignore Plugin документация:

Don’t generate modules for requests matching the provided RegExp.

Webpack пытается require модуль с именем node_modules/process/browser для React модуля и не с ним, потому что он игнорируется.

Попробуйте удалить node_modules из Ignore Plugin или напишите глобальное сообщение, если это действительно необходимо.

Answer 2

импортирующие nodeExternals работал для меня, это мой server.webpack.config:

import path from 'path'; 
 
**import nodeExternals from 'webpack-node-externals';** 
 

 
const CONTEXT = path.join(__dirname, "../.."), 
 
    INPUT_SERVER_DIR = path.join(CONTEXT, "server"), 
 
    OUTPUT_SERVER_DIR = path.join(CONTEXT, "dist/server"); 
 

 
export default [ 
 
    { 
 
    name: 'server', 
 
    target: 'node', 
 
    context: INPUT_SERVER_DIR, 
 
    node: { 
 
     __dirname: false 
 
    }, 
 
    entry: './server', 
 
    devtool : 'source-map', 
 
    output: { 
 
     path: OUTPUT_SERVER_DIR, 
 
     filename: "server.js" 
 
    }, 
 
    module: { 
 
     rules: [ 
 
     { 
 
      test: /\.js$/, 
 
      exclude: /node_modules/, 
 
      loader: "babel-loader" 
 
     } 
 
     ] 
 
    }, 
 
    resolve: { 
 
     extensions: ['.js'] 
 
    }, 
 
    **externals : [ nodeExternals() ]** 
 
    } 
 
];