Error cannot find module html webpack plugin - Исправление ошибок и поиск оптимальных решений проблем

I tried to create a basic React app with webpack 4 following this link

until installing «html-webpack-plugin», I did not face any errors. But, once I run the command «npm run start», I keep getting the following error:

**Error: Cannot find module 'html-webpack-plugin'
    at Function.Module._resolveFilename (module.js:547:15)
    at Function.Module._load (module.js:474:25)
    at Module.require (module.js:596:17)**

I tried to solve this issue using the following two threads by installing packages globally and locally, but it didn’t help.

error: cannot find module html-webpack-plugin

https://github.com/webpack/webpack-dev-server/issues/1330

Please see my code below:

package.json:

{
  "name": "react_website",
  "version": "1.0.0",
  "description": "Website using React and Webpack",
  "main": "index.js",
  "scripts": {
    "start": "webpack --mode development",
    "build": "webpack --mode production"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.5",
    "babel-preset-env": "^1.7.0",
    "babel-preset-react": "^6.24.1",
    "html-webpack-plugin": "^3.2.0",
    "webpack": "^4.16.2",
    "webpack-cli": "^2.1.5"
  },
  "dependencies": {
    "react": "^16.4.1",
    "react-dom": "^16.4.1"
  }
}

webpack.config.js:

const HtmlWebPackPlugin = require("html-webpack-plugin");

module.exports = {
  module: {
    rules: [
      {
        test: /.js$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader"
        }
      }
    ]
  },
  plugins: [
    new HtmlWebPackPlugin({
    template: "./src/index.html",
    filename: "./index.html"
  })
],
};

— .babelrc:

{
  "presets": ["env", "react"]
}

Источник

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and
privacy statement. We’ll occasionally send you account related emails.

Already on GitHub?
Sign in
to your account

Closed

bitwerk opened this issue

Aug 3, 2016

· 5 comments

Closed

Cannot find module ‘html-webpack-plugin’

#100

bitwerk opened this issue

Aug 3, 2016

· 5 comments

Comments

The solution was to run npm i html-webpack-plugin --save-dev before building with webpack.

OS: Windows 10
Node: v6.3.1
Book page: 6 (at ‘If you execute node_modules/.bin/webpack, you should see output …)
Stacktrace:

C:workwebpack-demo>node_modules.binwebpack.cmd
module.js:442
    throw err;
    ^

Error: Cannot find module 'html-webpack-plugin'
    at Function.Module._resolveFilename (module.js:440:15)
    at Function.Module._load (module.js:388:25)
    at Module.require (module.js:468:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (C:workwebpack-demowebpack.config.js:2:27)
    at Module._compile (module.js:541:32)
    at Object.Module._extensions..js (module.js:550:10)
C:workwebpack-demo>node_modules.binwebpack.cmd
module.js:442
    throw err;
    ^

Error: Cannot find module 'html-webpack-plugin'
    at Function.Module._resolveFilename (module.js:440:15)
    at Function.Module._load (module.js:388:25)
    at Module.require (module.js:468:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (C:workwebpack-demowebpack.config.js:2:27)
    at Module._compile (module.js:541:32)
    at Object.Module._extensions..js (module.js:550:10)
    at Module.load (module.js:458:32)
    at tryModuleLoad (module.js:417:12)
    at Function.Module._load (module.js:409:3)
    at Module.load (module.js:458:32)
    at tryModuleLoad (module.js:417:12)
    at Function.Module._load (module.js:409:3)

Hi,

There’s a snippet like To keep things simple to maintain, we'll be using html-webpack-plugin to generate an index.html for our application. html-webpack-plugin wires up the generated assets with it. Install it in the project: just before If you execute node_modules/.bin/webpack, you should see output.

Is it possible you missed that?

Thanks for the report. 👍

same, I’m also following this error but not understanding how to resolve.

@SAWC98 Can you link me to your project? It’s important to have the plugin installed.

Run below commond it will work 100%,i was facing same issue got resolve it.
npm install html-webpack-plugin

Источник

Содержание

Cannot resolve module html-webpack-plugin/lib/loader.js after upgrade to 2.25.0 #545
Comments
Entry module not found: Error: Can’t resolve ‘html-webpack-plugin/lib/loader.j s’ #4122
Comments
Cannot find module webpack – possible fixes
“Cannot find module webpack” error
Reinstall all modules
Use global webpack
Set NODE_ENV to development
Install webpack-cli
Check your command syntax
Русские Блоги
Устранить ошибку Не удается найти проблему с модулем «webpack»
Каталог статей

Cannot resolve module html-webpack-plugin/lib/loader.js after upgrade to 2.25.0 #545

Hi, after upgrade to version 2.25.0 (I have the same problem with version 2.26.0) I got an error:

I wasn’t able to find, what change caused this problem.

The text was updated successfully, but these errors were encountered:

Is the html-webpack-plugin in your node_modules folder?

yes, it is. When I downgrade to version 2.24.1, everything works fine.

@jantimon Same Problem here . @kuka-radovan What version you have down graded .

@tlrobinson version 2.24.1 is the latest working version to me.

I am using latest version 2.26.0, still i am getting below the error.

I am also seeing this exact same issue and can confirm that downgrading to 2.24.1 fixed the issue.

Can you give more information why the module can not be resolved?

Wish I could, but don’t know where to begin and am somewhat of a webpack newbie. I am using the following webpack.config.prod.js that I copied from create-react-app (and modified to include .less support).

When I moved my project to a different folder and ran a fresh npm install, the html-webpack-plugin version jumped from 2.24.1 to latest (thanks npm). When running a build, I got the same message as bboysathish (the output doesn’t tell me which file is causing problems). When I downgraded html-webpack-plugin, everything started working again.

I’d be happy to provide any additional information.

When I was checking changes in 2.25.0 release, I couldn’t find any suspicious changes that could cause that problem.

@kuka-radovan @pspaulding I am just wondering why webpack won’t find the html-webpack-plugin if it is inside your node_modules/html-webpack-plugin folder.

I’ll try to improve the resolution in an upcoming release

In the meanwhile please see the solution of @insin here:
9046e46

I just discovered the following (inside webpack.config.js):

Does not work:
resolveLoader:

Again, I had copied this from create-react-app and have no idea why moduleTemplates is being modified from the default.

Hi, I’m having the same issue. This must be the change that causes it, right?

Ah whoops, that was already mentioned above, never mind.

I had a similar issue mentioned here but with the plugin not being able to find lodash.js . You can expand the error by using the —display-error-details flag on webpack — and I could see that it was complaining that it couldn’t find lodash.js.js . Anyway I eventually figured out what had happened.

It was being caused by this config item:

In my webpack 1.x config the resolve.extensions config item has an empty string as the first property, which means it will find e.g. a filename of lodash.js in the order of lodash.js , lodash.js.js , lodash.jsx etc.

In webpack 2.x the empty string isn’t allowed, meaning the plugin has to give it a filename of lodash only and it will find it in the order of lodash.js , lodash.jsx etc

I’m not sure if this helps here but it solved my problem (in this case I was actually downgrading from webpack 2 to 1)

Источник

Entry module not found: Error: Can’t resolve ‘html-webpack-plugin/lib/loader.j s’ #4122

Do you want to request a feature or report a bug?

Bug

I upgraded from angular-cli@1.0.0-beta.21 to angular-cli@1.0.0-beta.25.5 , making all necessary changes to get my app running with ng serve successfully. However, when I attempt to deploy to Heroku, it fails with the curious error below.

My SO question is unanswered as of this. It’s not clear to me where this issue is best asked but I’ve raised with Angular CLI (no reply as of this), seems like webpack is next in line, then html-webpack-plugin or perhaps the @ngtools and/or style-loader . Perhaps someone with more knowledge of WebPack could point the direction?

What is the current behavior?
An ng build —prod of my (unfortunately private) project fails on Heroku but works fine on my local Linux setup.

If the current behavior is a bug, please provide the steps to reproduce.

Sadly, I have not, yet, been able to create a reproduction.

What is the expected behavior?

A successful build just like the local build.

Please mention other relevant information such as the browser version, Node.js version, webpack version and Operating System.

The text was updated successfully, but these errors were encountered:

Источник

Cannot find module webpack – possible fixes

Webpack is a powerful static module bundler that treats all files and assets as modules. Under the hood, it relies on a dependency graph to describe how modules relate to each other using references between files. Then, it uses that graph to “package” multiple JavaScript files into one.

Webpack’s ability to statically traverse all modules allows it to build a graph of all the code, which it then uses to generate a single bundle or several bundles of code. “Webpack’s “static” mode means that it doesn’t execute your source code, but instead stitches modules and their dependencies together into a bundle that you can include in your HTML files.

Beginners who are trying to set up their system for developing modern JavaScript applications often encounter “Cannot find module webpack” error. This article is going to show you several ways to fix the “Cannot find module webpack” in common scenarios.

“Cannot find module webpack” error

“Cannot find module webpack” may be one of the most common error when it comes to developing JavaScript programs. What we’re referring to are error messages that has something like “Error: Cannot find module ‘webpack-cli/package.json’” or “Error: Cannot find module ‘webpack/bin/config-yargs’”.

The specific error messages may varies but the reason behind them are the same : Your system cannot recognize webpack in where it supposed to be. It can be your NODE_ENV is not set right, or you’re using a legacy command syntax which webpack deprecated. Read on to find a proper solution for each causes.

Reinstall all modules

There are cases that “Cannot find module webpack” error pops up after a npm install package_name process has been suddenly interrupted.

In this case, you should remove the node_modules directory, package-lock.json (not the package.json), /dist folder. After that, run the following commands to clean npm cache and recreate node_modules .

Finally, reinstall all modules from scratch, then the error should be gone.

Use global webpack

One of the simplest method to quickly fix “Cannot find module webpack” error is to link your project to the globally installed version of webpack, instead of the local one. You can do that by running the following command.

In case you didn’t have webpack installed globally, here’s the command to do that.

Set NODE_ENV to development

If your NODE_ENV is not set right, packages managers like yarn might not be able to get your devDependencies installed.

In this case, you can try setting NODE_ENV to development and see if “Cannot find module webpack” error goes away.

In order to do that on Windows, open up the Command Prompt and run set NODE_ENV=development . In Linux, you can simply run a similar command to set NODE_ENV to development for the current bash session :

If you want to avoid running the command above over and over again, add it to one of the following files so that Bash can load it at startup.

Let’s suppose we are adding the line to

/.bash_profile , we would run the following commands in a terminal window.

Install webpack-cli

If your error messages contains webpack-cli , that means you’re missing the Command Line Interface of Webpack instead of Webpack itself. Install webpack-cli system-wide by running the command below.

Check your command syntax

If you’re using webpack-cli 4 or webpack 5, change webpack-dev-server to webpack serve in your package.json, so your start script may look like below.

For webpack-cli 3.x :

For webpack-cli 4.x :

Fore more information, check out the official webpack migration tutorial and webpack-dev-server.

We hope that the information above helps you successfully fixed “Cannot find module webpack” error. You may be insterested in our other troubleshooting tutorial such as fix npm: command not found, fix “nodemon: command not found” or fix JSON’s end of file expected

Источник

Русские Блоги

Устранить ошибку Не удается найти проблему с модулем «webpack»

Каталог статей

module.js:549
throw err;
^
Error: Cannot find module ‘webpack’
at Function.Module._resolveFilename (module.js:547:15)
at Function.Module._load (module.js:474:25)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
at Object. (/usr/local/lib/node_modules/webpack-dev-server/bin/webpack-dev-server.js:12:17)
at Module._compile (module.js:652:30)
at Object.Module._extensions…js (module.js:663:10)
at Module.load (module.js:565:32)
at tryModuleLoad (module.js:505:12)
at Function.Module._load (module.js:497:3)

1. Установите веб-пакет глобально

2. Введите ссылку на каталог проекта webpack

3. Упакуйте и снова запустите проект, npm run start обнаружил ошибку

Cannot find module ‘extract-text-webpack-plugin’
at Function.Module._resolveFilename (module.js:547:15)
at Function.Module._load (module.js:474:25)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
в объекте. (/home/galaxy/desktop/xiangmu/yi/build/utils.js:4:27)
at Module._compile (module.js:652:30)
at Object.Module._extensions…js (module.js:663:10)
at Module.load (module.js:565:32)
at tryModuleLoad (module.js:505:12)
at Function.Module._load (module.js:497:3)

Оказывается, не хватает подключаемых модулей webpack-plugin. Тогда нечего устанавливать. Читатели могут установить их в соответствии с отсутствующими подключаемыми модулями, о которых они сообщают.
Ниже приведены мои отчеты об ошибках и решения, полученные в ходе этого процесса.

4. Установите плагин extract-text-webpack.

Снова запустите проект и сообщите об ошибке:

Cannot find module ‘webpack-merge’
at Function.Module._resolveFilename (module.js:547:15)
at Function.Module._load (module.js:474:25)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
в Object. (/home/galaxy/desktop/xiangmu/yi/build/webpack.dev.conf.js:5:15)
at Module._compile (module.js:652:30)
at Object.Module._extensions…js (module.js:663:10)
at Module.load (module.js:565:32)
at tryModuleLoad (module.js:505:12)
at Function.Module._load (module.js:497:3)

5. Установите webpack-merge

Снова запустите проект и сообщите об ошибке:

Cannot find module ‘copy-webpack-plugin’
at Function.Module._resolveFilename (module.js:547:15)
at Function.Module._load (module.js:474:25)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
в Object. (/home/galaxy/desktop/xiangmu/yi/build/webpack.dev.conf.js:8:27)
at Module._compile (module.js:652:30)
at Object.Module._extensions…js (module.js:663:10)
at Module.load (module.js:565:32)
at tryModuleLoad (module.js:505:12)
at Function.Module._load (module.js:497:3)

6. Установите copy-webpack-plugin.

Ошибка запуска проекта:

Cannot find module ‘html-webpack-plugin’
at Function.Module._resolveFilename (module.js:547:15)
at Function.Module._load (module.js:474:25)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
в Object. (/home/galaxy/desktop/xiangmu/yi/build/webpack.dev.conf.js:9:27)
at Module._compile (module.js:652:30)
at Object.Module._extensions…js (module.js:663:10)
at Module.load (module.js:565:32)
at tryModuleLoad (module.js:505:12)
at Function.Module._load (module.js:497:3)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
в requireConfig (/home/galaxy/desktop/xiangmu/yi/node_modules/webpack/bin/convert-argv.js:97:18)
в /home/galaxy/desktop/xiangmu/yi/node_modules/webpack/bin/convert-argv.js:104:17.
at Array.forEach ()
в module.exports (/home/galaxy/desktop/xiangmu/yi/node_modules/webpack/bin/convert-argv.js:102:15)

7. Установите html-webpack-plugin.

Снова запустите проект и сообщите об ошибке:

Cannot find module ‘friendly-errors-webpack-plugin’
at Function.Module._resolveFilename (module.js:547:15)
at Function.Module._load (module.js:474:25)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
в Object. (/home/galaxy/desktop/xiangmu/yi/build/webpack.dev.conf.js:10:30)
at Module._compile (module.js:652:30)
at Object.Module._extensions…js (module.js:663:10)
at Module.load (module.js:565:32)
at tryModuleLoad (module.js:505:12)
at Function.Module._load (module.js:497:3)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
в requireConfig (/home/galaxy/desktop/xiangmu/yi/node_modules/webpack/bin/convert-argv.js:97:18)
в /home/galaxy/desktop/xiangmu/yi/node_modules/webpack/bin/convert-argv.js:104:17.
at Array.forEach ()
в module.exports (/home/galaxy/desktop/xiangmu/yi/node_modules/webpack/bin/convert-argv.js:102:15)

8. Установите плагин friendly-errors-webpack.

Снова запустите проект и обнаружите, что он по-прежнему сообщает об ошибке

Cannot find module ‘node-notifier’
at Function.Module._resolveFilename (module.js:547:15)
at Function.Module._load (module.js:474:25)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
в Object.exports.createNotifierCallback (/home/galaxy/desktop/xiangmu/yi/build/utils.js:86:20)
в portfinder.getPort (/home/galaxy/desktop/xiangmu/yi/build/webpack.dev.conf.js:88:17)
в /home/galaxy/desktop/xiangmu/yi/node_modules/portfinder/lib/portfinder.js:196:16.
в /home/galaxy/desktop/xiangmu/yi/node_modules/async/dist/async.js:473:16.
при пополнении (/home/galaxy/desktop/xiangmu/yi/node_modules/async/dist/async.js:1006:25)
в iterateeCallback (/home/galaxy/desktop/xiangmu/yi/node_modules/async/dist/async.js:995:17)
в /home/galaxy/desktop/xiangmu/yi/node_modules/async/dist/async.js:969:16.
в /home/galaxy/desktop/xiangmu/yi/node_modules/portfinder/lib/portfinder.js:157:16.
в Server.onListen (/home/galaxy/desktop/xiangmu/yi/node_modules/portfinder/lib/portfinder.js:43:7)
at Object.onceWrapper (events.js:313:30)
at emitNone (events.js:106:13)
at Server.emit (events.js:208:7)

9. Затем продолжайте установку node-notifier.

Снова запустите проект и обнаружите, что есть еще одна проблема:

10. Установите npm install —save.

Наконец, снова откройте терминал для запуска проекта, и он преуспел.

Источник

Before, the project directory was:

it ran successfully. Later, a new build file directory was created and the webpack.config.js It is moved to the build file,

package.json Script in

"scripts": {
    "test": "echo "Error: no test specified" && exit 1",
    "start": "node ./src/koa.js",
    "build": "webpack --config ./build/webpack.config.js"
  },

After configuration, run the

$ npm run build

Results error prompt:

NPX webpack cannot find module’html webpack plugin’a bug causes headache
extract-text-webpack-plugin» loader is used without the corresponding plugin Error (Fixed)
Run webpack error: Error: Cannot find module’webpack/lib/node/NodeTemplatePlugin’
Failed to load plugin jsdoc: Cannot find module ‘eslint-plugin-jsdoc‘
Cannot read property ‘this compilation’ of undefined appears in copy webpack plugin
Error: Cannot find module’webpack/bin/config-yargs’ solution
[Solved] Error: Cannot find module ‘webpack/lib/RequestShortener’
Solved – problem cannot find module ‘webpack / bin / config yargs’
Cannot find module ‘webpack cli / bin / config yargs‘
Error: Cannot find module ‘webpack/schemas/WebpackOptions.json’
Failed to load plugin react: cannot find module ‘eslint plugin react’ appears when running Vue project‘
Webpack Upgrade Error: webpack.NamedModulesPlugin is not a constructor
When starting Vue project: cannot find module ‘webpack cli/bin/config yargs’ error [How to Fix]
Error: cannot find module ‘webpack / lib / ruleset’_ solve
NPM run dev error: cannot find module ‘webpack cli / bin / config yargs‘
Error: solution to the problem of cannot find module ‘webpack / bin / config yargs’
VUE Error: Cannot find module ‘webpack/bin/config-yargs’
Error: Cannot find Module ‘Webpack-cli ‘- Solution
Webpack — module build failed: error: the node API for ‘Babel’ has been moved to Babel core
Vscode HTML file auto supplement HTML skeleton failure

Источник

Reinstall all modules

There are cases that “Cannot find module webpack” error pops up after a npm install package_name process has been suddenly interrupted.

In this case, you should remove the node_modules directory, package-lock.json (not the package.json), /dist folder. After that, run the following commands to clean npm cache and recreate node_modules.

npm cache clean --force npm install

Finally, reinstall all modules from scratch, then the error should be gone.

Use global webpack

npm link webpack

In case you didn’t have webpack installed globally, here’s the command to do that.

npm i -g webpack

Set NODE_ENV to development

If your NODE_ENV is not set right, packages managers like yarn might not be able to get your devDependencies installed.

In this case, you can try setting NODE_ENV to development and see if “Cannot find module webpack” error goes away.

In order to do that on Windows, open up the Command Prompt and run set NODE_ENV=development. In Linux, you can simply run a similar command to set NODE_ENV to development for the current bash session :

export NODE_ENV=development
Code language: JavaScript (javascript)

If you want to avoid running the command above over and over again, add it to one of the following files so that Bash can load it at startup.

~/.bash_profile
~/.bashrc
~/.profile

Let’s suppose we are adding the line to ~/.bash_profile, we would run the following commands in a terminal window.

echo export NODE_ENV=development >> ~/.bash_profile
source ~/.bash_profile
Code language: PHP (php)

Install webpack-cli

If your error messages contains webpack-cli, that means you’re missing the Command Line Interface of Webpack instead of Webpack itself. Install webpack-cli system-wide by running the command below.

npm install webpack-cli -g

Check your command syntax

If you’re using webpack-cli 4 or webpack 5, change webpack-dev-server to webpack serve in your package.json, so your start script may look like below.

"serve": "webpack serve --config config/webpack.dev.js --progress"

Code language: JavaScript (javascript)

For webpack-cli 3.x:

"scripts": {
    "start:dev": "webpack-dev-server"
    }
Code language: JavaScript (javascript)

For webpack-cli 4.x:

"scripts": {
    "start:dev": "webpack serve"
    }
Code language: JavaScript (javascript)

Fore more information, check out the official webpack migration tutorial and webpack-dev-server.

Источник

Каталог статей

1. Установите веб-пакет глобально
2. Введите ссылку на каталог проекта webpack
3. Упакуйте и снова запустите проект, npm run start обнаружил ошибку
4. Установите плагин extract-text-webpack.
5. Установите webpack-merge
6. Установите copy-webpack-plugin.
7. Установите html-webpack-plugin.
8. Установите плагин friendly-errors-webpack.
9. Затем продолжайте установку node-notifier.
10. Установите npm install —save.

При использовании webpack для упаковки и запуска проекта vue выдается сообщение об ошибке:

ошибка:

module.js:549
throw err;
^
Error: Cannot find module ‘webpack’
at Function.Module._resolveFilename (module.js:547:15)
at Function.Module._load (module.js:474:25)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
at Object. (/usr/local/lib/node_modules/webpack-dev-server/bin/webpack-dev-server.js:12:17)
at Module._compile (module.js:652:30)
at Object.Module._extensions…js (module.js:663:10)
at Module.load (module.js:565:32)
at tryModuleLoad (module.js:505:12)
at Function.Module._load (module.js:497:3)

решение:

1. Установите веб-пакет глобально

sudo npm install -g webpack

2. Введите ссылку на каталог проекта webpack

sudo npm link webpack

3. Упакуйте и снова запустите проект, npm run start обнаружил ошибку

Cannot find module ‘extract-text-webpack-plugin’
at Function.Module._resolveFilename (module.js:547:15)
at Function.Module._load (module.js:474:25)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
в объекте. (/home/galaxy/desktop/xiangmu/yi/build/utils.js:4:27)
at Module._compile (module.js:652:30)
at Object.Module._extensions…js (module.js:663:10)
at Module.load (module.js:565:32)
at tryModuleLoad (module.js:505:12)
at Function.Module._load (module.js:497:3)

4. Установите плагин extract-text-webpack.

 sudo npm install extract-text-webpack-plugin

Снова запустите проект и сообщите об ошибке:

Cannot find module ‘webpack-merge’
at Function.Module._resolveFilename (module.js:547:15)
at Function.Module._load (module.js:474:25)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
в Object. (/home/galaxy/desktop/xiangmu/yi/build/webpack.dev.conf.js:5:15)
at Module._compile (module.js:652:30)
at Object.Module._extensions…js (module.js:663:10)
at Module.load (module.js:565:32)
at tryModuleLoad (module.js:505:12)
at Function.Module._load (module.js:497:3)

5. Установите webpack-merge

sudo npm install webpack-merge

Снова запустите проект и сообщите об ошибке:

Cannot find module ‘copy-webpack-plugin’
at Function.Module._resolveFilename (module.js:547:15)
at Function.Module._load (module.js:474:25)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
в Object. (/home/galaxy/desktop/xiangmu/yi/build/webpack.dev.conf.js:8:27)
at Module._compile (module.js:652:30)
at Object.Module._extensions…js (module.js:663:10)
at Module.load (module.js:565:32)
at tryModuleLoad (module.js:505:12)
at Function.Module._load (module.js:497:3)

6. Установите copy-webpack-plugin.

sudo npm install copy-webpack-plugin

Ошибка запуска проекта:

Cannot find module ‘html-webpack-plugin’
at Function.Module._resolveFilename (module.js:547:15)
at Function.Module._load (module.js:474:25)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
в Object. (/home/galaxy/desktop/xiangmu/yi/build/webpack.dev.conf.js:9:27)
at Module._compile (module.js:652:30)
at Object.Module._extensions…js (module.js:663:10)
at Module.load (module.js:565:32)
at tryModuleLoad (module.js:505:12)
at Function.Module._load (module.js:497:3)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
в requireConfig (/home/galaxy/desktop/xiangmu/yi/node_modules/webpack/bin/convert-argv.js:97:18)
в /home/galaxy/desktop/xiangmu/yi/node_modules/webpack/bin/convert-argv.js:104:17.
at Array.forEach ()
в module.exports (/home/galaxy/desktop/xiangmu/yi/node_modules/webpack/bin/convert-argv.js:102:15)

7. Установите html-webpack-plugin.

sudo npm install html-webpack-plugin

Снова запустите проект и сообщите об ошибке:

Cannot find module ‘friendly-errors-webpack-plugin’
at Function.Module._resolveFilename (module.js:547:15)
at Function.Module._load (module.js:474:25)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
в Object. (/home/galaxy/desktop/xiangmu/yi/build/webpack.dev.conf.js:10:30)
at Module._compile (module.js:652:30)
at Object.Module._extensions…js (module.js:663:10)
at Module.load (module.js:565:32)
at tryModuleLoad (module.js:505:12)
at Function.Module._load (module.js:497:3)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
в requireConfig (/home/galaxy/desktop/xiangmu/yi/node_modules/webpack/bin/convert-argv.js:97:18)
в /home/galaxy/desktop/xiangmu/yi/node_modules/webpack/bin/convert-argv.js:104:17.
at Array.forEach ()
в module.exports (/home/galaxy/desktop/xiangmu/yi/node_modules/webpack/bin/convert-argv.js:102:15)

8. Установите плагин friendly-errors-webpack.

sudo npm install friendly-errors-webpack-plugin

Снова запустите проект и обнаружите, что он по-прежнему сообщает об ошибке

Cannot find module ‘node-notifier’
at Function.Module._resolveFilename (module.js:547:15)
at Function.Module._load (module.js:474:25)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
в Object.exports.createNotifierCallback (/home/galaxy/desktop/xiangmu/yi/build/utils.js:86:20)
в portfinder.getPort (/home/galaxy/desktop/xiangmu/yi/build/webpack.dev.conf.js:88:17)
в /home/galaxy/desktop/xiangmu/yi/node_modules/portfinder/lib/portfinder.js:196:16.
в /home/galaxy/desktop/xiangmu/yi/node_modules/async/dist/async.js:473:16.
при пополнении (/home/galaxy/desktop/xiangmu/yi/node_modules/async/dist/async.js:1006:25)
в iterateeCallback (/home/galaxy/desktop/xiangmu/yi/node_modules/async/dist/async.js:995:17)
в /home/galaxy/desktop/xiangmu/yi/node_modules/async/dist/async.js:969:16.
в /home/galaxy/desktop/xiangmu/yi/node_modules/portfinder/lib/portfinder.js:157:16.
в Server.onListen (/home/galaxy/desktop/xiangmu/yi/node_modules/portfinder/lib/portfinder.js:43:7)
at Object.onceWrapper (events.js:313:30)
at emitNone (events.js:106:13)
at Server.emit (events.js:208:7)

9. Затем продолжайте установку node-notifier.

 sudo npm install node-notifier

Снова запустите проект и обнаружите, что есть еще одна проблема:

10. Установите npm install —save.

sudo npm install --save

Наконец, снова откройте терминал для запуска проекта, и он преуспел.

Источник

Я попытался создать базовое приложение React с webpack 4 после этого ссылка на сайт

До установки «html-webpack-plugin» ошибок не возникало. Но как только я запускаю команду «npm run start», я продолжаю получать следующую ошибку:

**Error: Cannot find module 'html-webpack-plugin'
    at Function.Module._resolveFilename (module.js:547:15)
    at Function.Module._load (module.js:474:25)
    at Module.require (module.js:596:17)**

Я попытался решить эту проблему с помощью следующих двух потоков, установив пакеты глобально и локально, но это не помогло.

Ошибка: не удается найти модуль html-webpack-plugin

Https://github.com/webpack/webpack-dev-server/issues/1330

Пожалуйста, посмотрите мой код ниже:

Package.json:

{
  "name": "react_website",
  "version": "1.0.0",
  "description": "Website using React and Webpack",
  "main": "index.js",
  "scripts": {
    "start": "webpack --mode development",
    "build": "webpack --mode production"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.5",
    "babel-preset-env": "^1.7.0",
    "babel-preset-react": "^6.24.1",
    "html-webpack-plugin": "^3.2.0",
    "webpack": "^4.16.2",
    "webpack-cli": "^2.1.5"
  },
  "dependencies": {
    "react": "^16.4.1",
    "react-dom": "^16.4.1"
  }
}

Webpack.config.js:

const HtmlWebPackPlugin = require("html-webpack-plugin");

module.exports = {
  module: {
    rules: [
      {
        test: /.js$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader"
        }
      }
    ]
  },
  plugins: [
    new HtmlWebPackPlugin({
    template: "./src/index.html",
    filename: "./index.html"
  })
],
};

— .babelrc:

{
  "presets": ["env", "react"]
}

Источник

Cannot find module ‘html-webpack-plugin’ #100

Comments

Cannot resolve module html-webpack-plugin/lib/loader.js after upgrade to 2.25.0 #545

Entry module not found: Error: Can’t resolve ‘html-webpack-plugin/lib/loader.j s’ #4122

Cannot find module webpack – possible fixes

“Cannot find module webpack” error

Reinstall all modules

Use global webpack

Set NODE_ENV to development

Install webpack-cli

Check your command syntax

Русские Блоги

Устранить ошибку Не удается найти проблему с модулем «webpack»

Каталог статей

1. Установите веб-пакет глобально

2. Введите ссылку на каталог проекта webpack

3. Упакуйте и снова запустите проект, npm run start обнаружил ошибку

4. Установите плагин extract-text-webpack.

5. Установите webpack-merge

6. Установите copy-webpack-plugin.

7. Установите html-webpack-plugin.

8. Установите плагин friendly-errors-webpack.

9. Затем продолжайте установку node-notifier.

10. Установите npm install —save.

Read More:

Reinstall all modules

Use global webpack

Set NODE_ENV to development

Install webpack-cli

Check your command syntax

Каталог статей

1. Установите веб-пакет глобально

2. Введите ссылку на каталог проекта webpack

3. Упакуйте и снова запустите проект, npm run start обнаружил ошибку

4. Установите плагин extract-text-webpack.

5. Установите webpack-merge

6. Установите copy-webpack-plugin.

7. Установите html-webpack-plugin.

8. Установите плагин friendly-errors-webpack.

9. Затем продолжайте установку node-notifier.

10. Установите npm install —save.

Cannot find module ‘html-webpack-plugin’

#100