Question

我是React js的新手，在运行npm start时会引发以下错误

> y@1.0.0 start /home/ajeesh/Documents/reactApp
> webpack-dev-server --mode development --open --hot

internal/modules/cjs/loader.js:628
    throw err;
    ^

Error: Cannot find module 'html-webpack-plugin'
Require stack:
- /home/ajeesh/Documents/reactApp/webpack.config.js
- /home/ajeesh/Documents/reactApp/node_modules/webpack-cli/bin/utils/convert-argv.js
- /home/ajeesh/Documents/reactApp/node_modules/webpack-dev-server/bin/webpack-dev-server.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:625:15)
    at Function.Module._load (internal/modules/cjs/loader.js:527:27)
    at Module.require (internal/modules/cjs/loader.js:683:19)
    at require (internal/modules/cjs/helpers.js:16:16)
    at Object.<anonymous> (/home/ajeesh/Documents/reactApp/webpack.config.js:2:27)
    at Module._compile (internal/modules/cjs/loader.js:777:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:788:10)
    at Module.load (internal/modules/cjs/loader.js:643:32)
    at Function.Module._load (internal/modules/cjs/loader.js:556:12)
    at Module.require (internal/modules/cjs/loader.js:683:19) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/home/ajeesh/Documents/reactApp/webpack.config.js',
    '/home/ajeesh/Documents/reactApp/node_modules/webpack-cli/bin/utils/convert-argv.js',
    '/home/ajeesh/Documents/reactApp/node_modules/webpack-dev-server/bin/webpack-dev-server.js'
  ]
}
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! y@1.0.0 start: `webpack-dev-server --mode development --open --hot`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the y@1.0.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/ajeesh/.npm/_logs/2019-08-13T10_25_24_772Z-debug.log

跟随package.json

   const path = require('path');
   const HtmlWebpackPlugin = require('html-webpack-plugin');

   module.exports = {
       entry: './main.js',
       output: {
       path: path.join(__dirname, '/bundle'),
       filename: 'index_bundle.js'
       },
  devServer: {
      inline: true,
      port: 8001
    },
  module: {
  rules: [
     {
        test: /\.jsx?$/,
        exclude: /node_modules/,
        loader: 'babel-loader',
        query: {
           presets: ['es2015', 'react']


        }
            }
         ]
      },
      plugins:[
           new HtmlWebpackPlugin({
                template: './index.html'
           })
       ]
   }

webpack.config.js

 {
    "name": "y",
    "version": "1.0.0",
    "description": "",
    "main": "index.js",
    "scripts": {
        "start": "webpack-dev-server --mode development --open -- 
                  hot",
        "build": "webpack --mode production"
   },
   "author": "",
   "license": "ISC",
   "dependencies": {
        "babel-core": "^6.26.3",
        "babel-loader": "^8.0.6",
        "babel-preset-env": "^1.7.0",
        "react": "^16.9.0",
        "react-dom": "^16.9.0"
     },
   "devDependencies": {
   "webpack": "^4.39.1",
   "webpack-cli": "^3.3.6",
   "webpack-dev-server": "^3.8.0",
    "webpack-merge": "^4.2.1"
  }
}

先谢谢了。我关注了https://www.tutorialspoint.com/reactjs/reactjs_environment_setup.htm 我正在使用Ubuntu 18.04.2 LTS，如果您有解决此问题的方法，那会很好吗？

Answer 1

您可能必须做$ eval $(minishift oc-env)或将npm install html-webpack-plugin添加到package.json并做html-webpack-plugin

找不到模块'webpack / bin / config-yargs'-反应JS

1 个答案: