Webpack cli не работает

webpack не распознается как внутренняя или внешняя команда, работающая программа или командный файл

Я изучаю React.js и использую ОС Windows 8. Я перешел в свою корневую папку

webpack не распознается как внутренняя или внешняя команда, работающая программа или командный файл

У меня тоже была эта проблема долгое время. (webpack установлен глобально и т. д., но все еще не распознается) Оказалось, что я не указал переменную окружения для npm (где находится файл webpack.cmd), поэтому я добавляю в свою переменную Path

Если вы используете Powershell, вы можете ввести следующую команду, чтобы эффективно добавить в свой путь:

ВАЖНО: не забудьте закрыть и снова открыть окно PowerShell, чтобы применить это.

Лучшее решение этой проблемы — Webpack глобальная установка .

Это всегда работает, и это сработало для меня. Попробуйте команду ниже.

В качестве альтернативы, если у вас установлен локально Webpack, вы можете явно указать, где командная строка должна искать его, например:

(Это предполагает, что вы находитесь внутри каталога с вашим package.json и что вы уже запустили npm install webpack .)

npm install -g webpack-dev-server решит вашу проблему

Попробуйте удалить node_modules в локальном каталоге и повторно запустить npm install .

Добавьте команду webpack как сценарий npm в свой package.json.

Когда веб-пакет установлен, он создает двоичный файл в папке ./node_modules/.bin. Скрипты npm также ищут исполняемый файл, созданный в этой папке

Интерфейс командной строки Webpack теперь находится в отдельном пакете и должен быть установлен глобально, чтобы использовать команду webpack:

РЕДАКТИРОВАТЬ: многое изменилось. Пользователи Webpack не рекомендуют устанавливать CLI глобально (или отдельно в этом отношении). Эта проблема должна быть исправлена ​​сейчас, но правильная команда установки:

Этот ответ изначально был задуман как «временное решение» проблемы OP.

вам необходимо установить webpack и webpack-cli в одной области.

если вы устанавливаете его локально, вам нужно называть его специально

Мы тоже столкнулись с этой проблемой, и мне нравятся все ответы, в которых предлагается использовать сценарий, определенный в package.json .

Для наших решений мы часто используем следующую последовательность:

1. npm install —save-dev webpack-cli (если вы используете webpack v4 или новее, в противном случае используйте npm install —save-dev webpack , см. установку webpack , получено 19 января 2019 г.)
2. npx webpack

Шаг 1 — разовый. Шаг 2 также проверяет ./node_modules/.bin . Вы также можете добавить второй шаг как сценарий npm package.json , например:

а затем используйте npm run build для выполнения этого сценария.

Протестировано это решение с npm версии 6.5.0, webpack версии 4.28.4 и webpack-cli версии 3.2.1 в Windows 10, выполняя все команды внутри окна PowerShell. Моя версия nodejs — 10.14.2. Я также тестировал это на Ubuntu Linux версии 18.04.

Я бы посоветовал не устанавливать webpack глобально, в частности, если вы работаете с большим количеством разных проектов, для каждого из которых может потребоваться другая версия webpack. Глобальная установка webpack привязывает вас к определенной версии для всех проектов на одном компьютере.

Источник

webpack command not working

I am new to Node Js and Webpack. I tried to start a project with module-loaders.

Firstly, I installed nodeJs and NPM and created a new directory called tutorial . I used the command prompt to cd into this directory and then ran the following command npm init and then installed webpack via npm using the command below :

The 1st command installed webpack locally into the project under the ‘node-modules’ directory and I can run my project by doing this:

The problem with this is that I have to place my webpack.config.js file inside of this directory which I want to place in my project root.

One solution to this problem was to install webpack globally on my machine which I did using the command below :

This installed Webpack and now I do have a Webpack command. However, this command does not seem to be working or doing anything at all. When I try to run this from my project’s root directroy it does not do anything at all (See Screenshot)

Please tell me what I am doing wrong!!

8 Answers 8

webpack is not only in your node-modules/webpack/bin/ directory, it’s also linked in node_modules/.bin .

You have the npm bin command to get the folder where npm will install executables.

You can use the scripts property of your package.json to use webpack from this directory which will be exported.

You can then run it with:

Or even with arguments:

This allow you to have you webpack.config.js in the root folder of your project without having webpack globally installed or having your webpack configuration in the node_modules folder.

/.bash_profile. Then it prompts me install webpack CLI. I wait for a second it will prompts again that «would you like to install webpack-cli (yes/no)» . I typed yes and then I can use webpack.

You can run npx webpack . The npx command, which ships with Node 8.2/npm 5.2.0 or higher, runs the webpack binary (./node_modules/.bin/webpack) of the webpack package. Source of info: https://webpack.js.org/guides/getting-started/

I had to reinstall webpack to get it working with my local version of webpack, e.g:

installs webpack globally on your system, that makes it available in terminal window.

The problem with my setup was webpack was installed but webpack-cli was missing

If you prefer to install locally then install without -g flag

The quickest way, just to get this working is to use the web pack from another location, this will stop you having to install it globally or if npm run webpack fails.

When you install webpack with npm it goes inside the » node_modules\.bin » folder of your project.

in command prompt (as administrator)

1. go to the location of the project where your webpack.config.js is located.
2. in command prompt write the following

Installing webpack with -g option installs webpack in a folder in

C:\Users\ \AppData\Roaming\npm\node_modules

same with webpack-cli and webpack-dev-server

Outside the global node_modules a link is created for webpack to be run from commandline

C:\Users\ \AppData\Roaming\npm

to make this work locally, I did the following

1. renamed the webpack folder in global node_modules to _old
2. installed webpack locally within project
3. edited the command link webpack.cmd and pointed the webpack.js to look into my local node_modules folder within my application

Problem with this approach is you’d have to maintain links for each project you have. Theres no other way since you are using the command line editor to run webpack command when installing with a -g option.

So if you had proj1, proj2 and proj3 all with their local node_modules and local webpack installed( not using -g when installing), then you’d have to create non-generic link names instead of just webpack.

example here would be to create webpack_proj1.cmd, webpack_proj2.cmd and webpack_proj3.cmd and in each cmd follow point 2 and 3 above

Источник

команда webpack не работает

Я новичок в узле Js и Webpack. Я попытался запустить проект с помощью загрузчиков модулей.

во-первых, я установил nodeJs и NPM и создал новый каталог под названием tutorial . Я использовал командную строку для компакт-диска в этот каталог, а затем выполнил следующую команду npm init а затем установлен webpack через npm используя команду ниже:

1-я команда установила webpack локально в проект в каталоге «node-modules», и я могу запустить свой проект, делая это:

проблема в том, что я должен разместить свой webpack.config.js файл внутри этого каталога, который я хочу разместить в моем корне проекта.

одним из решений этой проблемы была установка webpack глобально на моей машине, которую я сделал с помощью команды ниже:

это установленный Webpack, и теперь у меня есть команда Webpack. Однако эта команда, похоже, не работает или вообще ничего не делает. Когда я пытаюсь запустить это из корневого directroy моего проекта он вообще ничего не делает (см. скриншот)

пожалуйста, скажите мне, что я делаю неправильно!!

6 ответов

webpack не только в node-modules/webpack/bin/ каталог, он также связан в node_modules/.bin .

у вас npm bin команда для получения папки, в которой npm установит исполняемые файлы.

можно использовать scripts свойства package.json использовать webpack из этого каталога, который будет экспортироваться.

затем вы можете запустить его с:

или даже с аргументы:

это позволит вам, чтобы вы webpack.config.js в корневой папке вашего проекта без глобальной установки webpack или конфигурации webpack в .

устанавливает webpack глобально в системе, что делает его доступным в окне терминала.

мне пришлось переустановить webpack, чтобы он работал с моей локальной версией webpack, e.g:

самый быстрый способ, чтобы получить эту работу, чтобы использовать веб-пакет из другого места, это остановит вас, чтобы установить его глобально или если npm run webpack не удается.

когда вы устанавливаете webpack с npm, он входит в » node_modules\.bin папка» вашего проекта.

в командной строке (от имени администратора)

1. перейдите в расположение проекта, где находится ваш webpack.конфиг.js находится.
2. в командной строке пишем следующее

установка webpack с опцией-g устанавливает webpack в папку в

\C:\Users \AppData\роуминг\npm\node_modules

то же самое с webpack-cli и webpack-dev-server

за пределами глобальных node_modules создается ссылка для запуска webpack из командной строки

\C:\Users \AppData\роуминг\npm

чтобы сделать эту работу локально, я сделал после

1. переименовал папку webpack в global node_modules в _old
2. установлен webpack локально в рамках проекта
3. отредактировал командную ссылку webpack.cmd и указал на webpack.js, чтобы заглянуть в мою локальную папку node_modules в моем приложении

проблема с этим подходом заключается в том, что вам придется поддерживать ссылки для каждого проекта. Другого способа нет, так как вы используете редактор командной строки для запуска webpack команда при установке с опцией a-G.

поэтому, если бы у вас были proj1, proj2 и proj3 с их локальными node_modules и локальным webpack установлен( не используя-g при установке), то вам пришлось бы создавать не общие имена ссылок, а просто webpack.

примером здесь было бы создать webpack_proj1.cmd, webpack_proj2.cmd и webpack_proj3.cmd и в каждом cmd следуйте пунктам 2 и 3 выше

PS: Не забудьте обновить пакет.json с эти изменения, иначе вы получите ошибки, так как он не найдет команду webpack

на самом деле, я получил эту ошибку некоторое время назад. Насколько мне известно, есть два способа заставить это работать.

1. сервер не будет обновлять изменения, внесенные в индекс.js из-за некоторых ошибок webpack. Итак, перезагрузите сервер.
2. обновление узла.js будет полезно избежать таких проблем.

Источник

После установки webpack и webpack-cli все еще получает ошибку при запуске webpack

у меня установлены последние версии webpack:

еще когда я бегу webpack в терминале я получаю следующее:

4 ответов

кажется, что вы установили глобально только webpack , а не webpack-cli .

таким образом, npm install -g webpack-cli решает эту проблему.

объяснение и альтернативные решения:

почему существует проблема в первую очередь? Следующее указывает на то, что оба webpack и webpack-cli пакеты устанавливаются локально:

у меня установлены последние версии webpack:

под управлением webpack in ваш терминал не может найти локально установленную версию (предоставляется webpack-cli С webpack-4). Это потому, что ваша локальная папка исполняемых файлов не включена в вашу оболочку PATH переменной (список каталогов, в которых оболочка ищет команды). Тропинка, где npm установить исполняемые файлы локально составляет ./node_modules/.bin (дополнительная информация здесь).

поэтому вместо того, чтобы пытаться запустить просто webpack необходимо выполнить:

кроме того, добавление к вашим package.json скрипт, который использует just webpack работает, потому что npm добавляет local ./node_modules/.bin/ каталог к пути оболочки перед выполнением скриптов (см. npm run).

затем выполните в терминале: npm run build

в резюме, я думаю, что package.json скрипт является более четким и желательным способом.

попробуйте эту команду с помощью Npm:

команда webpack перемещает вещи в webpack-cli. Я попытался установить webpack-cli глобально, это дало мне ошибку GIT, как показано ниже.

пожалуйста, проверьте, установлен ли у вас git и на вашем пути.

поэтому я сначала установил GIT из https://gitforwindows.org/ и затем установил webpack-cli с помощью npm.

в этом блоге есть подробный скриншот и исправление для устранения этой ошибки угловой webpack GIT и webpack-cli ошибка.

в версии webpack ^4.0.0 CLI webpack был перемещен в другой пакет. Хотя это изменение не было отражено в документах, существует pull-запрос решении данной проблемы.

Carloluis это решите свою проблему, но я хотел бы добавить, что его рекомендуется не делать глобальные установки. Так просто npm install -D webpack-cli в папке проекта будет делать.

Источник

Unable to load ‘@webpack-cli/serve’ command #2990

Comments

jtoar commented Oct 7, 2021 •

Describe the bug

RedwoodJS’s dev server uses webpack-dev-server under the hood. It broke as soon as @webpack-cli/serve v1.6 was released.

Redwood users start the dev server with yarn rw dev . It runs this command:

Which resolves to something like:

Our webpack development config can be found here; it’s merged with webpack.common.js , so I’ve included that as well:

What is the current behavior?

Currently, with the new release of @webpack-cli/serve , the dev server doesn’t start up and throws:

To Reproduce

Steps to reproduce the behavior:

1. create a v0.37.2 redwood project using yarn create redwood-app my-redwood-app
2. run yarn rw dev
3. observe the error in the console

Expected behavior

The dev server starts up successfully on localhost:8910 .

Screenshots

The dev server broken:

The dev server working:

Please paste the results of npx webpack-cli info here, and mention other relevant information

Additional context

• Here’s the bug report in redwoodjs/redwood: redwoodjs/redwood#3522
• Here’s our temporary fix: redwoodjs/redwood#3524

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

thedavidprice commented Oct 7, 2021

I also experienced this issue. Multiple reports from other people with the same error.

Manually pinning (and setting resolution) this package to v1.52.0 is the workaround.

clandsky commented Oct 7, 2021

Hi, i get a similar issue when i run browserDevelopmentRun target via gradle, which calls @webpack-cli/serve. I was tinkering around with KotlinJs.
Seems, that 1.6.0 broke the build. Until then, everything worked fine for me.

[webpack-cli] Unable to load ‘@webpack-cli/serve’ command [webpack-cli] TypeError: options.forEach is not a function [webpack-cli] TypeError: options.forEach is not a function at WebpackCLI.makeCommand (D:\Workspace\clsky.de\build\js\node_modules\webpack-cli\lib\webpack-cli.js:173:21) at ServeCommand.apply (D:\Workspace\clsky.de\build\js\node_modules\webpack-cli\node_modules\@webpack-cli\serve\lib\index.js:41:19) at loadCommandByName (D:\Workspace\clsky.de\build\js\node_modules\webpack-cli\lib\webpack-cli.js:907:35) at async Command. (D:\Workspace\clsky.de\build\js\node_modules\webpack-cli\lib\webpack-cli.js:1462:17) at async Promise.all (index 0) at async WebpackCLI.run (D:\Workspace\clsky.de\build\js\node_modules\webpack-cli\lib\webpack-cli.js:1500:9) at async runCLI (D:\Workspace\clsky.de\build\js\node_modules\webpack-cli\lib\bootstrap.js:11:9)

alexander-akait commented Oct 7, 2021 •

Remove @webpack-cli/serve from your package.json (https://github.com/redwoodjs/redwood/blob/main/packages/core/package.json#L30), don’t use this package directly or bump this together with webpack-cli , otherwise you will get these problems.

alexander-akait commented Oct 7, 2021

Even we fix small incompatibility between package (but it is internal package, you will not find information about usage this in docs), it still will be problem for your because you are pin dependencies https://github.com/redwoodjs/redwood/blob/main/packages/core/package.json#L30, I strongly recommend to avoid pinning deps, your have lock file to prevent installation new version, but unpinning allow developers fix these problems

alexander-akait commented Oct 7, 2021

Anyway feel free to feedback

Artur- commented Oct 7, 2021 •

I am not sure how this advice helps. My package.json is

yesterday resulted in the dev server starting. Today it results in

alexander-akait commented Oct 7, 2021 •

@Artur- try to update lock file (and transitive deps) or maybe you have global install webpack-cli?

Artur- commented Oct 7, 2021

Oh I have deleted lock files multiple times. What is supposed to change?

webpack-cli should stay 4.8.0 as specified, it depends on «@webpack-cli/serve»: «^1.5.2», so it brings in @webpack-cli/serve 1.6.0 and the two are apparently not compatible?

alexander-akait commented Oct 7, 2021

Yep, because it is internal package you should have webpack-cli 4.9.0 and do not have @webpack-cli/serve in your package.json , in lock file it should be 1.6.0

Artur- commented Oct 7, 2021

I am not using webpack-cli 4.9.0 . I am using webpack-cli 4.8.0

Artur- commented Oct 7, 2021

Surely you cannot be saying that it is OK that 4.8.0 stops working because 4.9.0 is available?

alexander-akait commented Oct 7, 2021 •

@Artur- Can you provide reproducible example? I really can’t reproduce locally Your problem — lock file was updated i.e. now you have @webpack-cli/serve@1.6.0 , but uses old verison of webpack-cli@4.8.0 , @webpack-cli/serve is internal package and should be updated together with webpack-cli

alexander-akait commented Oct 7, 2021 •

Looks like we have small regression here, but if we revert it, it will create another breaking change, so my recommendation — bump webpack-cli@4.9.0 and update lock file, also check you don’t have @webpack-cli/serve in package.json directly.

Artur- commented Oct 7, 2021

Thanks, if the minor versions of the packages truly should go hand in hand maybe you can use

instead of ^ to avoid this in the future and still be able to make internal breaking changes

alexander-akait commented Oct 7, 2021 •

It really shouldn’t have happened (but happens 😄 ), for future major release we refactor our architecture to avoid these problems

thedavidprice commented Oct 7, 2021

Grateful for your help here @alexander-akait And no need to apologize about regressions happening — only have sympathy from me!

Your problem — lock file was updated i.e. now you have @webpack-cli/serve@1.6.0, but uses old verison of webpack-cli@4.8.0, @webpack-cli/serve is internal package and should be updated together with webpack-cli

^^ This does not work in testing.

To clarify the behavior I was experiencing:

• using webpack-cli v4.8 : Because the ^ is used in package.json, in the background @webpack-cli/serve v1.6 was installed because semver. So I suspect (without looking at the code) this could propagate backwards to previous versions.
• using webpack-cli v4.9 : same error and can confirm was using @webpack-cli/serve@1.6.0

So I don’t see another way to prevent this other than the workaround in the OP. For our circumstances, telling people to remove a package from yarn.lock is not viable.

Question: Could you release a patch of webpack-cli, e.g. v4.8.1, that pins «@webpack-cli/serve»: «1.5.2» — no ^ so there won’t be semver issue?

Lastly, I’m sorry but it wasn’t clear if there’s a fix coming so I’m not sure why this issue was closed?

alexander-akait commented Oct 7, 2021

using webpack-cli v4.9: same error and can confirm was using @webpack-cli/serve@1.6.0

Double check this, run npm ls webpack-cli and npm ls @webpack-cli/serve@1.6.0

Question: Could you release a patch of webpack-cli, e.g. v4.8.1, that pins «@webpack-cli/serve»: «1.5.2» — no ^ so there won’t be semver issue?

It will be very bad, I prefer to avoid it

alexander-akait commented Oct 7, 2021 •

Anyway if you need to help fastly please try to provide reproducible steps, our CI for lastest version for webpack v4 and webpack v5 are green.

alexander-akait commented Oct 7, 2021

And how @webpack-cli/serve appears in your deps, we never ask that in our docs.

jtoar commented Oct 7, 2021

And how @webpack-cli/serve appears in your deps, we never ask that in our docs.

Just to clarify, we did this only to fix the bug we were experiencing.

Sorry that the steps to reproduce above weren’t accurate—we released a patch after posting this issue. Here’s steps to reproduce, including a video showing exactly what I see on my machine:

webpack-cli-reproduction.mp4

alexander-akait commented Oct 7, 2021

Thanks, I will looking at this tomorrow (busy right now), maybe do patch release to avoid problem

thedavidprice commented Oct 7, 2021

Thank you @alexander-akait Anything @jtoar and I can do to help — please just let us know. We’re open source maintainers as well and don’t take your effort (or webpack-cli) for granted.

I just followed you on Twitter in case DM’s (or to get on a real-time call) would be helpful to you. You can reach me via DM https://twitter.com/thedavidprice

Overall, I think the semver ^ is the reason this is a cascading issue:

Источник