1

每当我跑webpack-dev-server它抛出这个错误:无法配置webpack.config文件

....webpack/hot/only-dev-server ./src Module not found: Error: Can't resolve './src' in 'C:\....

这里的webpack.config.js文件

var webpack = require('webpack'); 
var path = require('path'); 

module.exports = { 
    devtool: "inline-source-map", 
    entry: [ 
     "webpack-dev-server/client?http://127.0.0.1:8080/", 
     "webpack/hot/only-dev-server", 
     "./src" 
    ], 
    output: { 
     path: path.join(__dirname, 'public'), 
     filename: 'bundle.js' 
    }, 
    resolve: { 
     modules: ['node_modules', 'src'], 
     extensions: ['.js'] 
    }, 
    module: { 
     loaders: [ 
      { 
       test: /\.jsx?$/, 
       exclude: /(node_modules|bower_components)/, 
       loaders: ['react-hot-loader','babel-core?presets[]=react,presets[]=es2015'], 
      } 
     ] 
    }, 
    plugins: [ 
     new webpack.HotModuleReplacementPlugin(), 
     new webpack.NoEmitOnErrorsPlugin() 
    ], 
}; 

的package.json

{ 
    "name": "react-todo", 
    "version": "1.0.0", 
    "description": "", 
    "main": "index.js", 
    "scripts": { 
    "test": "echo \"Error: no test specified\" && exit 1" 
    }, 
    "keywords": [], 
    "author": "", 
    "license": "ISC", 
    "dependencies": { 
    "babel": "^6.23.0", 
    "babel-core": "^6.23.1", 
    "babel-loader": "^6.3.2", 
    "babel-plugin-add-module-exports": "^0.2.1", 
    "babel-plugin-react-html-attrs": "^2.0.0", 
    "babel-plugin-transform-class-properties": "^6.23.0", 
    "babel-plugin-transform-decorators-legacy": "^1.3.4", 
    "babel-preset-es2015": "^6.22.0", 
    "babel-preset-react": "^6.23.0", 
    "babel-preset-stage-0": "^6.22.0", 
    "lodash": "^4.17.4", 
    "react": "^15.4.2", 
    "react-dom": "^15.4.2", 
    "webpack": "^2.2.1", 
    "webpack-dev-server": "^2.3.0" 
    }, 
    "devDependencies": { 
    "react-hot-loader": "^1.3.1" 
    } 
} 

我该如何解决?

+0

您的'src'文件夹中是否有'index。*'? src'文件夹是否存在?尝试将最后一个入口点作为文件而不是文件夹,例如'。/ src'到'。/ src/index.js' –

+0

现在它说'不能解决react-hot',更新我的代码! –

+0

你是否'npm install --save-dev react-hot-loader'?现在我做了 –

回答

1

似乎你(错误消息'C:\...')使用Windows和的WebPack expects窗户路径分隔符,像\,不/。你可以试试".\src\your_entry_file.js"而不是"./src"

1

试试这个:

更新你的包JSON这样:

{ 
    "name": "react-todo", 
    "version": "1.0.0", 
    "description": "", 
    "main": "index.js", 
    "scripts": { 
    "test": "echo \"Error: no test specified\" && exit 1", 
    "start": "node server.js" 
    }, 
    "keywords": [], 
    "author": "", 
    "license": "ISC", 
    "dependencies": { 
    "lodash": "^4.17.4", 
    "react": "^15.4.2", 
    "react-dom": "^15.4.2" 
    }, 
    "devDependencies": { 
    "react-hot-loader": "^1.3.1", 
    "webpack": "^2.2.1", 
    "webpack-dev-server": "^2.3.0", 
    "babel": "^6.23.0", 
    "babel-core": "^6.23.1", 
    "babel-loader": "^6.3.2", 
    "babel-plugin-add-module-exports": "^0.2.1", 
    "babel-plugin-react-html-attrs": "^2.0.0", 
    "babel-plugin-transform-class-properties": "^6.23.0", 
    "babel-plugin-transform-decorators-legacy": "^1.3.4", 
    "babel-preset-es2015": "^6.22.0", 
    "babel-preset-react": "^6.23.0", 
    "babel-preset-stage-0": "^6.22.0", 
    } 
} 

然后从你的项目文件夹的根目录运行npm install

webpack.config.js这个

var webpack = require('webpack'); 
var path = require('path'); 

module.exports = { 
    devtool: "inline-source-map", 
    entry: [ 
     "webpack-dev-server/client?http://127.0.0.1:8080/", 
     "webpack/hot/only-dev-server", 
     "./src/app.js" // or whatever your entry file is 
    ], 
    output: { 
     path: path.join(__dirname, 'public'), 
     filename: 'bundle.js' 
    }, 
    resolve: { 
     modules: ['node_modules', 'src'], 
     extensions: ['.js'] 
    }, 
    module: { 
     loaders: [ 
      { 
       test: /\.js$/, 
       exclude: /(node_modules|bower_components)/, 
       loader: 'babel-loader', 
       query: { 
        presets: ['es2015'] 
       } 
      }, 
      // the loader should be broken up into two objects 
      { test: /\.jsx?$/, loaders: ['react-hot', 'jsx?harmony'], include: path.join(__dirname, 'src') } 
     ] 
    }, 
    plugins: [ 
     new webpack.HotModuleReplacementPlugin(), 
     new webpack.NoEmitOnErrorsPlugin() 
    ], 
}; 
更新

下载thisserver.js文件并将其保存到项目文件夹。

然后尝试npm start

希望工程。祝你好运。请参考here

+0

错误再次检查讨论 –

+0

@JaskaranSinghPuri哦,我忘记了,也做'npm install --save-dev express' –