Laravel 8 Vue 3 - Npm run hot (mix watch --hot) 抛出错误，可能是 webpack 问题答案

【问题标题】：Laravel 8 Vue 3 - Npm run hot (mix watch --hot) throwing error,possible webpack issueLaravel 8 Vue 3 - Npm run hot (mix watch --hot) 抛出错误，可能是 webpack 问题
【发布时间】：2021-02-26 08:27:44
【问题描述】：

编辑：可能是因为我的用户名有空格，所以 webpack cli 在处理这种路径时遇到了问题？

我正在尝试使用我的 Laravel 设置 Vue 3，但由于某种原因，laravel mix 或 webpack 向我抛出错误，尝试卸载 webpack 和 webpack cli 并再次安装它，但没有帮助。

Npm 版本：6.14.6

包.json

{
"private": true,
"scripts": {
    "dev": "npm run development",
    "development": "mix",
    "watch": "mix watch",
    "watch-poll": "mix watch -- --watch-options-poll=1000",
    "hot": "mix watch --hot",
    "prod": "npm run production",
    "production": "mix --production"
},
"devDependencies": {
    "@types/webpack-env": "^1.16.0",
    "@vue/compiler-sfc": "^3.0.6",
    "axios": "^0.21",
    "laravel-mix": "^6.0.0-beta.17",
    "laravel-mix-vue3": "^0.7.0",
    "lodash": "^4.17.19",
    "postcss": "^8.1.14",
    "vue": "^3.0.6",
    "vue-loader": "^16.1.2",
    "webpack": "^5.24.2",
    "webpack-cli": "^4.5.0"
},
"dependencies": {}

Webpack.mix.js

const mix = require('laravel-mix');
require("laravel-mix-vue3");

mix.vue3("resources/js/app.js", "public/js")
.postCss('resources/css/app.css', 'public/css', [
    //
]);

错误：

> mix watch --hot

[webpack-cli] Failed to load 'C:\Users\PC' config
[webpack-cli] Error: Cannot find module 'C:\Users\PC'
Require stack:
- C:\Users\PC Master Race\Desktop\Laravel\learn-vue\vue3test\node_modules\webpack-cli\lib\webpack-cli.js
- C:\Users\PC Master Race\Desktop\Laravel\learn-vue\vue3test\node_modules\webpack-cli\lib\bootstrap.js
- C:\Users\PC Master Race\Desktop\Laravel\learn-vue\vue3test\node_modules\webpack-cli\bin\cli.js
- C:\Users\PC Master Race\Desktop\Laravel\learn-vue\vue3test\node_modules\webpack\bin\webpack.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:965:15)
    at Function.Module._load (internal/modules/cjs/loader.js:841:27)
    at Module.require (internal/modules/cjs/loader.js:1025:19)
    at require (C:\Users\PC Master Race\Desktop\Laravel\learn-vue\vue3test\node_modules\v8-compile-cache\v8-compile-cache.js:159:20)
    at loadConfig (C:\Users\PC Master Race\Desktop\Laravel\learn-vue\vue3test\node_modules\webpack-cli\lib\webpack-cli.js:1158:31)
    at C:\Users\PC Master Race\Desktop\Laravel\learn-vue\vue3test\node_modules\webpack-cli\lib\webpack-cli.js:1245:74
    at Array.map (<anonymous>)
    at WebpackCLI.resolveConfig (C:\Users\PC Master Race\Desktop\Laravel\learn-vue\vue3test\node_modules\webpack-cli\lib\webpack-cli.js:1245:32)
    at WebpackCLI.createCompiler (C:\Users\PC Master Race\Desktop\Laravel\learn-vue\vue3test\node_modules\webpack-cli\lib\webpack-cli.js:1670:33)
    at Command.<anonymous> (C:\Users\PC Master Race\Desktop\Laravel\learn-vue\vue3test\node_modules\@webpack-cli\serve\lib\index.js:67:40) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'C:\\Users\\PC Master Race\\Desktop\\Laravel\\learn-vue\\vue3test\\node_modules\\webpack-cli\\lib\\webpack-cli.js',
    'C:\\Users\\PC Master Race\\Desktop\\Laravel\\learn-vue\\vue3test\\node_modules\\webpack-cli\\lib\\bootstrap.js',
    'C:\\Users\\PC Master Race\\Desktop\\Laravel\\learn-vue\\vue3test\\node_modules\\webpack-cli\\bin\\cli.js',
    'C:\\Users\\PC Master Race\\Desktop\\Laravel\\learn-vue\\vue3test\\node_modules\\webpack\\bin\\webpack.js'
  ]
}

【问题讨论】：

标签： laravel webpack vuejs3 laravel-mix

【解决方案1】：

在整个互联网上搜索了几天和几个小时后，我终于找到了答案。

这与你进入项目目录的方式有关。请看下面：

我以这种方式 cd 到我的项目文件夹中

cd C:/Repo/myproject/Laravel

这给了我上述错误

但是当我这样做时

cd C:/repo/myproject/laravel

它起作用了，注意文件夹名称的大小写很重要，它需要完全匹配你所说的文件夹，它显然区分大小写。

祝你好运！

【讨论】：

【解决方案2】：

好吧，看来我的 windows 用户名导致了这个错误，创建了一个新帐户用户名中没有空格，现在 webpack-cli 正在按预期工作，webpack如果我理解错误，-cli 可能会认为路径中有空格是路径的结尾

【讨论】：