javascript - Webpack 找不到入口模块

Question

我从 Webpack 1 迁移到 Webpack 2，现在当我在项目上运行 Webpack 时，出现此错误:

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

我的 package.json 是:

{
 "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"
 },
}

这是我的 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]"],
      }
    ],
  },
}

我对如何设置 Webpack 2 感到困惑，它给我带来了一些问题，所以可能只是我的 webpack 配置文件有错误。是什么原因导致此错误以及如何修复它？

Answer 1

您配置了context为 ./app/。 Webpack 解析配置中使用的所有内容，就像您位于 ./app/ 目录中一样。如错误所示，它查找文件 ./app/src/app.js，该文件不存在。

您要么需要更改/删除context选项(默认为当前目录)，要么必须调整入口点的路径。