den0820
@den0820
Фронтенд Junior разработчик.

При сборке Webpack выдает ошибки?

ERROR in multi main
Module not found: Error: Cannot resolve 'file' or 'directory' C:\react-training\node_modules\webpack-dev-server\client\index.js in C:\react-training/src
@ multi main

ERROR in multi main
Module not found: Error: Cannot resolve 'file' or 'directory' ./src/app.js in C:\react-training/src
@ multi main

package.json:
{
  "name": "react_course_01_07",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "npm run dev",
    "api": "node simple_api/server.js",
    "dev": "webpack-dev-server --hot --inline"
  },
  "repository": {
    "type": "git",
    "url": ""
  },
  "author": "",
  "license": "ISC",
  "bugs": {
    "url": "https://github.com/romabelka/js_ru_01_07.git"
  },
  "homepage": "https://github.com/romabelka/js_ru_01_07.git",
  "devDependencies": {
    "autoprefixer-loader": "3.2.0",
    "babel-core": "^6.5.2",
    "babel-loader": "^6.2.3",
    "babel-polyfill": "^6.13.0",
    "babel-preset-es2015": "^6.5.0",
    "babel-preset-react": "^6.5.0",
    "babel-preset-react-hmre": "^1.1.1",
    "babel-preset-stage-0": "^6.5.0",
    "babel-plugin-transform-runtime": "^6.12.0",
    "webpack": "^1.12.14",
    "webpack-dev-server": "^1.14.1",
    "css-loader": "^0.23.1",
    "style-loader": "^0.13.1",
    "extract-text-webpack-plugin": "^1.0.1",
    "file-loader": "^0.9.0",
    "less": "2.7.1",
    "less-loader": "2.2.3",
    "react-hot-loader": "^1.3.0",
    "url-loader": "^0.5.7"
  },
  "dependencies": {
    "react": "^15.2.0",
    "react-addons-css-transition-group": "^15.2.0",
    "react-day-picker": "^2.3.3",
    "react-dom": "^15.2.0",
    "react-redux": "^4.4.5",
    "react-router": "2.6.1",
    "react-select": "^1.0.0-beta14",
    "redux": "^3.5.2",
    "redux-thunk": "^2.1.0"
  }
}


webpack.config.js:
const webpack = require('webpack');
const path = require('path');
//const ExtractTextPlugin = require('extract-text-webpack-plugin');

const NODE_ENV = process.env.NODE_ENV || 'development';

module.exports = {
    context: __dirname + '/src',
    devtool: NODE_ENV == 'development' ? 'cheap-inline-module-source-map' : null,
    entry: [
        './src/app.js'
    ],
    output: {
        path: __dirname + '/public',
        filename: 'bundle.js'
        //publicPath: 'http://localhost:3000/'
    },
    watch: NODE_ENV == 'development',
    watchOptions: {
        aggregateTimeout: 100
    },
    plugins: [
        new webpack.HotModuleReplacementPlugin(),
        //new ExtractTextPlugin('bundle.css'),
        new webpack.DefinePlugin({
            NODE_ENV: JSON.stringify(NODE_ENV)
        }),
        new webpack.NoErrorsPlugin()
    ],
    resolve: {
        modulesDirectories: ['node_modules'],
        moduleTemplates: ['*', 'index'],
        extensions: ['.js', '.json'],
        root: __dirname + '/src'
    },
    resolveLoader: {
        modulesDirectories: ['node_modules', 'bower_components'],
        moduleTemplates: ['*-loader', '*'],
        extensions: ['.js', '.json']
    },
    devServer: {
        host: '127.0.0.1',
        port: 3000,
        contentBase: __dirname + '/public',
        inline: true,
        hot: true,
        historyApiFallback: true
    },
    module: {
        loaders: [
            {
                test: /\.js$/,
                exclude: /node_modules/,
                loaders: ['react-hot', 'babel-loader'],
                include: [
                    path.resolve(__dirname, 'src')
                ],
                plugins: ['transform-runtime']
            },
            {
                test: /\.jsx?/,
                loaders: ['babel'],
                include: path.join(__dirname, 'src')
            },
            {
                test: /\.css$/,
                loader: 'style-loader!css-loader'
            }
        ]
    }
};
  • Вопрос задан
  • 1909 просмотров
Пригласить эксперта
Ответы на вопрос 1
larisamoroz
@larisamoroz
Курю маны, втыкаю в код, ваяю, починяю.
Вы же подключили модуль path для платформо-независимого разрешения путей в системе.
В конфиге вы используете директиву context — это будет путь, от кторого будут искаться все входные точки ( entry ) и лоадеры.
Используйте модуль path с учётом значения context или уберите context из конфигурации :

module.exports = {
    devtool: NODE_ENV == 'development' ? 'cheap-inline-module-source-map' : null,
    entry: [
       path.join(__dirname, '/src/app.js')
    ],
…
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы