webpack不被识别为内部或外部命令,可操作程序或批处理文件

时间:2016-03-05 04:52:40

标签: npm webpack

我正在学习React.js,我正在使用Windows 8 OS.i已导航到我的根文件夹

1.Created the package.json file by npm init
2. install webpack by npm install -S webpack.now webpack has been downloaded to my modules folder
3. install webpack globally by typing npm install webpack -g
4. i am also having a webpack.config.js in my root folder which contains the source and ouput directory
5. when i type the webpack command i am getting the below error.

webpack未被识别为内部或外部命令,可运行程序或批处理文件

24 个答案:

答案 0 :(得分:132)

更好地解决此问题的方法是全局安装Webpack

这总是有效,对我有用。尝试以下命令。

npm install -g webpack

答案 1 :(得分:74)

作为替代方案,如果您在本地安装了Webpack,则可以明确指定命令提示符的查找位置,如下所示:

node_modules\.bin\webpack

(这确实假设您位于包含package.json的目录中并且您已经运行npm install webpack。)

答案 2 :(得分:61)

我也有这个问题很长一段时间了。 (webpack全球安装等但仍无法识别) 原来我没有为npm指定环境变量(文件webpack.cmd坐在哪里) 所以我添加到我的Path变量

%USERPROFILE%\AppData\Roaming\npm\

如果您使用的是Powershell,则可以键入以下命令以有效地添加到路径中:

[Environment]::SetEnvironmentVariable("Path", "$env:Path;%USERPROFILE%\AppData\Roaming\npm\", "User")

重要提示:不要忘记关闭并重新打开您的PowerShell窗口以便应用此功能。

希望它有所帮助。

答案 3 :(得分:40)

npm install -g webpack-dev-server将解决您的问题

答案 4 :(得分:9)

在package.json中添加webpack命令作为npm脚本。

{
    "name": "react-app",
    "version": "1.0.0",
    "scripts": {
      "compile": "webpack --config webpack.config.js"
    }
}

然后运行

  

npm run compile

安装webpack后,它会在./node_modules/.bin文件夹中创建一个二进制文件。 npm脚本还会查找在此文件夹中创建的可执行文件

答案 5 :(得分:9)

Webpack CLI现在位于一个单独的包中,必须全局安装才能使用'webpack'命令:

[string_of_int; string_of_float]

编辑:已经发生了很大变化。 Webpack人员不建议全局安装CLI(或单独安装)。此问题现在应该修复,但正确的安装命令是:

* -> *

这个答案原本是针对OP问题的“解决方案”。

答案 6 :(得分:8)

尝试删除本地目录中的 node_modules 并重新运行 npm install

答案 7 :(得分:4)

也许全新安装可以解决该问题。该“命令”会删除所有先前的模块,然后重新安装它们,也许是在webpack模块未完全下载和安装的时候。

npm clean-install

答案 8 :(得分:3)

只需以管理员身份运行命令行(cmd)。

答案 9 :(得分:3)

我遇到了同样的问题,只是将代码块添加到我的package.json文件中;

 "scripts": {
   "build": "webpack -d --progress --colors"
 }

然后在终端上运行命令;

npm run build

答案 10 :(得分:3)

您必须在同一范围内安装webpack和webpack-cli。

npm i -g webpack webpack-cli

npm i webpack webpack-cli

如果在本地安装,则需要专门调用

node_modules/.bin/webpack -v

答案 11 :(得分:2)

如果为JS项目创建样板文件夹以便可以使用JS模块,则webpackBabel是很好的工具。

请不要全局安装webpack,并且在安装了两者的最新版本之后,您的package.json文件将被加载并准备为将来的项目进行复制。

请确保删除node_modules文件夹以减小样板文件夹中的文件大小,然后使用npm install重新安装node_modules。

我忘记运行npm install并尝试运行webpack开发服务器时一直出现此错误,直到我意识到需要运行npm install来安装node_modules才能起作用。

答案 12 :(得分:2)

我们也遇到了这个问题,我喜欢使用package.json中定义的脚本建议的所有答案。

对于我们的解决方案,我们通常使用以下顺序:

  1. npm install --save-dev webpack-cli(如果您使用的是webpack v4或更高版本,否则使用npm install --save-dev webpack,请参阅webpack installation,于2019年1月19日检索)
  2. npx webpack

步骤1是一次性的。步骤2还检查./node_modules/.bin。您也可以将第二步作为npm脚本添加到package.json中,例如:

{
   ...
   "scripts": {
      ...
      "build": "npx webpack --mode development",
      ...
   },
   ...
}

,然后使用npm run build执行此脚本。

在Windows 10上使用npm 6.5.0版,webpack 4.28.4版和webpack-cli 3.2.1版测试了该解决方案,并在PowerShell窗口中执行了所有命令。我的nodejs版本是10.14.2。我还在Ubuntu Linux版本18.04上对此进行了测试。

建议不要在全球范围内安装webpack,尤其是当您处理许多不同的项目时,每个项目可能需要不同版本的webpack。全局安装webpack会将您锁定到同一台计算机上所有项目的特定版本。

答案 13 :(得分:1)

全局安装WebPack

admin

答案 14 :(得分:1)

如果您刚刚克隆了一个仓库,则首先需要运行

npm install

如果缺少项目依赖项,则会生成您得到的错误。上面的命令将下载并安装它们。

答案 15 :(得分:1)

npx webpack

对我有用。我正在使用Windows 10,并且在本地安装了webpack。

答案 16 :(得分:1)

我遇到了同样的错误,没有一个解决方案对我有用,我重新安装了节点,并修复了我的环境,一切又恢复了。

答案 17 :(得分:1)

以下给出的命令对我有用。

npm cache clean --force
npm install -g webpack

注意-以管理员身份运行这些命令。安装后,请关闭命令提示符并重新启动以查看应用的更改。

答案 18 :(得分:0)

尝试一下,cli需要更新为最新版本

$ pod install
Ignoring unf_ext-0.0.7.4 because its extensions are not built.  Try: gem pristine unf_ext --version 0.0.7.4
Analyzing dependencies
Fetching podspec for `React` from `../node_modules/react-native`
Fetching podspec for `react-native-image-picker` from `../node_modules/react-native-image-picker`
Fetching podspec for `react-native-maps` from `../node_modules/react-native-maps`
[!] CocoaPods could not find compatible versions for pod "React/RCTGeolocation":
  In Podfile:
    React/RCTGeolocation (from `../node_modules/react-native`)

None of your spec sources contain a spec satisfying the dependency: `React/RCTGeolocation (from `../node_modules/react-native`)`.

You have either:
 * out-of-date source repos which you can update with `pod repo update` or with `pod install --repo-update`.
 * mistyped the name or version.
 * not added the source repo that hosts the Podspec to your Podfile.

Note: as of CocoaPods 1.0, `pod repo update` does not happen on `pod install` by default.

信用归R.Richards所有 https://stackoverflow.com/a/44526528/1908827

答案 19 :(得分:0)

对我来说,解决方法是在本地将webpack安装为devDependency。尽管我将其命名为npm install --only=dev,但尚未将其安装在node_modules文件夹中。所以我跑了 <fieldset> <label>How old are you?</label> <input type="number" id="myAge" value="" min="1" max="99"> <label >How many...</label> <select id="what" name='what' onchange="calculateTotal()"> <option value="Cans of Coke">Cans of Coke have I drank</option> </select> <label>How many per week?</label> <input type="number" id="perWeek" value=""><br><br> <input type='submit' id='submit' value='How Many!' onclick="myFunction(),buttonHide()"/> </fieldset>

答案 20 :(得分:0)

对我来说,它可以单独安装webpack。很简单:

$npm install
$npm install webpack

我不确定为什么这是必要的,但是确实有效。

答案 21 :(得分:0)

升级到 React 16.12.0 时,我遇到了这个问题。

在呈现DOM时,我遇到了两个错误,一个与 webpack 有关,另一个与 store 有关。

Webpack错误:

  

webpack无法识别为内部或外部命令,可运行程序或批处理文件

Webpack解决方案:

  1. 关闭相关的VS解决方案
  2. 删除node_modules文件夹
  3. 已删除package-lock.json
  4. npm install
  5. npm rebuild
  6. 重复2-3次

存储错误:

  

类型Store <()>不能分配给类型Store

商店解决方案:

关于更新我的React版本的建议对我来说并没有解决此错误,但是不管我建议这样做。

我的代码最终看起来像这样:

ReactDOM.render(
        <Provider store={store as any}>
            <ConnectedApp />
        </Provider>,
        document.getElementById('app')
    );

根据this solution

答案 22 :(得分:-1)

我遇到了同样的问题,无法解决。我遍历了每一行代码,却找不到我的错误。然后我意识到我将webpack安装在错误的文件夹中。我的错误是没有注意将Webpack安装到的文件夹。

答案 23 :(得分:-1)

有时 npm install -g webpack 无法正常保存。最好使用 npm install webpack --save 。它对我有用。