错误:无法找到模块'webpack'

我刚刚开始与webpack和我有困难得到multiple-entry-points样本构建。示例中的webpack.config.js文件包含以下行

 var CommonsChunkPlugin = require("../../lib/optimize/CommonsChunkPlugin");

这个错误对我来说是无效的

Error: Cannot find module '../../lib/optimize/CommonsChunkPlugin'

在搜索中，我找到了其他使用CommonsChunkPlugin和表达式的示例

var commonsPlugin = new webpack.optimize.CommonsChunkPlugin("common.js");

哪个错误会失败

ReferenceError: webpack is not defined

更多的搜索发现了一些例子，包括

var webpack = require('webpack');

我的构建现在失败了

Error: Cannot find module 'webpack'

我不知道该怎么做。

389254 次浏览
小开

这似乎是Windows的一个常见问题。这为我解决了问题:

Nodejs无法在Windows上找到已安装的模块?< / >

添加一个名为NODE_PATH的环境变量，并将其设置为%USERPROFILE%\Application Data\npm\node_modules (Windows XP)， %AppData%\npm\node_modules (Windows 7)，或npm最终在Windows风格上安装模块的任何地方。为了一劳永逸地完成它，将其添加为系统属性对话框的高级选项卡中的系统变量(运行control.exe sysdm.cpl,System,3)。”

注意，实际上不能在NODE_PATH值内使用另一个环境变量。也就是说，不要只是复制粘贴上面的字符串，而是将其设置为一个实际的解析路径，如C:\Users\MYNAME\AppData\Roaming\npm\node_modules

小开

当我在windows上工作时，我在本地安装了webpack，它解决了我的问题

因此，在你的命令提示符中，进入你想要运行webpack的目录，在本地安装webpack(不带-g)，然后享受…

小开

我在OS X上遇到了这个问题，这似乎是由于我的全局安装的webpack和本地安装的webpack-dev-server之间的版本不匹配造成的。将两者更新到最新版本就解决了这个问题。

小开

链接全局安装包到您的项目:

npm link webpack

检出yarn link的官方文档。

小开

如果您已经安装了一个节点包，但仍然收到包未定义的消息，则可能与指向二进制文件的PATH链接有关。澄清一下，二进制文件和可执行文件本质上做的是相同的事情，即执行一个包或应用程序。ei webpack……执行节点包webpack。

在Windows和Linux中都有一个全局二进制文件夹。在Windows中，我认为它是C://Windows/System32，在Linux中是usr/bin。当您打开终端/命令提示符时，它的概要文件将PATH变量链接到全局bin文件夹，以便您能够从它执行包/应用程序。

我最好的猜测是，全局安装webpack可能没有成功地将可执行文件放在全局二进制文件夹中。如果没有可执行文件，您将得到一条错误消息。这可能是另一个问题，但可以肯定地说，如果你正在阅读这篇文章，那么全局运行webpack并不适合你。

我对这个问题的解决方案是取消全局运行webpack，并将PATH链接到node_module二进制文件夹，即/node_modules/.bin。

< >强窗口: 将node_modules/.bin添加到PATH中。 在这里是一个关于如何在windows中更改PATH变量的教程

< >强LINUX: 到你的项目根目录执行这个…

export PATH=$PWD/node_modules/.bin:$PATH

在Linux中，每次打开终端时都必须执行这个命令。这链接向你展示了如何将PATH变量永久化。

小开

在windows上，我观察到，如果您在计算机上没有管理权限(即，您不是本地管理员)，就会出现这个问题。

正如其他人建议的那样，解决方案似乎是通过不使用-g提示在本地安装。

小开

上面建议的任何方法都不适合我(包括NODE_PATH变量)。我创建了一个sym链接的“node_modules”从我的本地文件夹到全局AppData(如下所示)，它就像魅力。

C:\Users\mmoinuddin\AppData\Roaming\npm>mklink /D node_modules c:\essportreact\day1\node_modules
symbolic link created for node_modules <<===>> c:\essportreact\day1\node_modules
C:\essportreact\day1>webpack
Hash: 2a82a67f90f9aa05ab4a
Version: webpack 1.15.0
小开

在终端运行以下命令:

npm install --save-dev webpack

npm install --save-dev webpack-dev-server

小开

刚刚发现使用Atom IDE终端没有在本地安装依赖项(可能是一个错误或只是我)。在外部安装git bash并再次运行npm命令对我来说是有效的

小开

对我来说，这是一个错误的错误反馈。

在webpack.config.js中有配置错误，

删除文件，重新开始解决了我的问题

小开
在VS 2017中构建一个非常简单的。net Core 2.0应用程序时，我遇到了很多问题。这是AppVeyor的错误，但在本地本质上是一样的 (为了安全起见，省略了一些路径):

执行第一次运行Webpack构建…

< p > module.js: 327 把犯错,< / p >

EXEC: error:无法找到模块“......../node_modules/webpack/bin/webpack.js”

在Function.Module。_resolveFilename (module.js 325:15):

在Function.Module。_load (module.js 276:25):

Function.Module.runMain (module.js:441:10)

在启动时(node.js:140:18)

在node . js: 1043:3

csproj(25,5): error MSB3073: The command "node node_modules/webpack/bin/webpack.js——config webpack.config.vendor.js" exit with code 1。

构建失败了。

我偶然发现了这个问题和答案，并且我注意到我的本地实例在{Project Root} -> Dependencies -> npm文件夹上也有相同的警告标志。右键单击并点击“Restore packages”就可以正确地加载所有内容，并且我能够成功地构建。

小开

打开npm命令提示符和——cd解决方案文件夹 然后 只要在NPM cmd prompt中运行NPM链接webpack并重新构建.

小开

你可以试试这个。

npm install --only=dev

这对我很管用。

小开

我解决了同样的问题，重新安装，执行这些命令

rm -rf node_modules
rm -f package-lock.json
npm install

__abc0始终是一个危险的命令，特别是-f，请在执行它之前注意!!!!!

小开

npm链接webpack

我的webpack配置: :“webpack ^ 4.41.2”, :“webpack-dev-server ^ 3.9.0”, :“webpack-cli ^ 3.3.10 " < / p >
小开

在全球范围内安装webpack和CLI对我来说是有效的。

npm i -g webpack webpack-cli
小开

对于Visual Studio用户:右键单击npm文件夹，然后“恢复包”。

小开

在我的情况下，帮助我更改父文件夹名称并从此名称中删除一些&，你也可以尝试更改保存代码的名称或文件夹。

小开

虽然建议的解决方案(npm link webpack)在本地工作，但在我的CI (GitHub动作)上，我有同样的问题，为了解决它，我使用了:

 npm i --save-dev webpack
小开

我也遇到过同样的问题，我通过这个命令解决了，看看这个将解决你的问题。

rm -Rf node_modules
rm -f package-lock.json
npm install
小开

Laravel用户

如果以上选项都不适合您，那么您可能需要正确安装laravell -mix。以下是如何做到的:

npm install laravel-mix --save-dev

现在使用下面的命令创建一个webpack.mix.js文件:

touch webpack.mix.js

将以下代码添加到webpack.mix.js文件中:

mix.js('resources/js/app.js', 'public/js').postCss('resources/css/app.css', 'public/css', [
require('postcss-import'),
require('tailwindcss'),
require('autoprefixer'),
]);

你可能还需要使用命令touch tailwind.config.js创建一个tailwind.config.js文件，然后将以下代码添加到其中:


module.exports = {
content: [
'./vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php',
'./storage/framework/views/*.php',
'./resources/views/**/*.blade.php',
],


theme: {
extend: {
fontFamily: {
sans: ['Nunito', ...defaultTheme.fontFamily.sans],
},
},
},


plugins: [require('@tailwindcss/forms')],
};

最后运行npm run dev

小开

所以有相当少的可能的问题，在我的情况下，在windows:

我将我的项目移动到一个名称为&的文件夹，这对windows来说很好，但它会破坏npm。我的解决方案是从名称中删除&。

test&mocking→test_and_mocking

小开

为我解决这个问题的是webpack.config的路径在build.js中是错误的

小开 
rm -rf node_modules
rm -rf package.json-lock
npm install --force or npm install --legacy-peer-deps
小开 
rm -rf node_modules
rm -rf package-lock.json
npm install -f

提交答案