Webpack找不到入口模块

Question

I migrated from Webpack 1 to Webpack 2 and now when I run Webpack on my project I get this error:

ERROR in Entry module not found: Error: Can't resolve './src/app.js' in '/Users/user1/Documents/AAA/app'
resolve './src/app.js' in '/Users/user1/Documents/AAA/app'
 using description file: /Users/user1/Documents/AAA/package.json (relative path: ./app)
   Field 'browser' doesn't contain a valid alias configuration
  after using description file: /Users/user1/Documents/AAA/package.json (relative path: ./app)
    using description file: /Users/user1/Documents/AAA/package.json (relative path: ./app/src/app.js)
      as directory
        /Users/user1/Documents/AAA/app/src/app.js doesn't exist
     no extension
       Field 'browser' doesn't contain a valid alias configuration
        /Users/user1/Documents/AAA/app/src/app.js doesn't exist
     *
       Field 'browser' doesn't contain a valid alias configuration
        /Users/user1/Documents/AAA/app/src/app.js* doesn't exist
     .js
       Field 'browser' doesn't contain a valid alias configuration
        /Users/user1/Documents/AAA/app/src/app.js.js doesn't exist
     .jsx
       Field 'browser' doesn't contain a valid alias configuration
        /Users/user1/Documents/AAA/app/src/app.js.jsx doesn't exist
     .json
       Field 'browser' doesn't contain a valid alias configuration
        /Users/user1/Documents/AAA/app/src/app.js.json doesn't exist

My package.json is:

{
 "name": "AAA",
 "version": "1.0.0",
 "description": "",
 "main": "index.js",
 "scripts": {
   "test": "echo \"Error: no test specified\" && exit 1",
   "dev": "node ./node_modules/webpack-dev-server/bin/webpack-dev-server.js --hot --inline --history-api-fallback"
 },

 "devDependencies": {
   "babel-core": "^6.21.0",
   "babel-loader": "^6.2.10",
   "babel-preset-es2015": "^6.24.0",
   "babel-preset-react": "^6.16.0",
   "eslint": "^3.13.1",
   "eslint-config-airbnb": "^14.0.0",
   "eslint-plugin-import": "^2.2.0",
   "eslint-plugin-jsx-a11y": "^3.0.2",
   "eslint-plugin-react": "^6.9.0",
   "file-loader": "^0.9.0",
   "react-hot-loader": "^3.10.10",
   "react-router": "^3.0.2",
   "webpack": "^2.4.1",
   "webpack-dev-server": "^1.16.2"
 },
 "dependencies": {
   "react": "^15.5.4",
   "react-dom": "^15.5.4",
   "react-hot-loader": "^3.10.10"
 },
}

this is my webpack.config.js:

const path = require('path');

module.exports = {
  context: __dirname + "/app",

  entry: {
    app: "./src/app.js",
    javascript: "./js/app.js",
    html: "./index.html",
  },

  output: {
    //output.path: "[name].js",
    path: __dirname + "/dist",
    filename: "[name].js"
  },

  resolve: {
    alias: { 'react/lib/ReactMount': 'react-dom/lib/ReactMount' },
    extensions: [ '*', '.js', '.jsx', '.json'],
    modules:[__dirname, './app/js', 'node_modules'],
  },

  module: {
    rules: [
      {
        test: /\.jsx?$/,
        include: [
          path.resolve(__dirname, "app")
        ],
        loaders: ["babel-loader"],
      },
      {
        test: /\.html$/,
        loader: ["file-loader?name=[name].[ext]"],
      }
    ],
  },
}

I'm confused on how Webpack 2 should be set up and it has given me some problems so it might just be that my webpack config file has errors. What is causing this error and how can I fix it?

Answer 1

You configured context to be ./app/ . Webpack resolves everything that is used in the config as if you were in the ./app/ directory. As shown by the error, it looks for the file ./app/src/app.js , which doesn't exist.

You either need to change / remove the context option (it defaults to the current directory) or you have to adjust the paths of the entry points.