第一个Vue项目跑不起来

问题遇到的现象和发生背景

在安装vue的时候出现了配置错误,一直无法解决,vue,npm,webpack 都已经下载了,可能版本不兼容导致出现问题,在跑vue项目时出错了。

用代码块功能插入代码,请勿粘贴截图
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! myvue@1.0.0 dev: `webpack-dev-server --inline --progress --config build/webpack.dev.conf.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the myvue@1.0.0 dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\10721\AppData\Roaming\npm-cache\_logs\2022-09-23T07_36_29_069Z-debug.log


运行结果及报错内容

相关版本如下

img


出现的错误

D:\eclipse 作业\vue-study\myvue>npm run dev

> myvue@1.0.0 dev D:\eclipse 作业\vue-study\myvue
> webpack-dev-server --inline --progress --config build/webpack.dev.conf.js

internal/modules/cjs/loader.js:800
    throw err;
    ^

Error: Cannot find module 'webpack/bin/config-yargs'
Require stack:
- D:\eclipse 作业\vue-study\myvue\node_modules\webpack-dev-server\bin\webpack-dev-server.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:797:15)
    at Function.Module._load (internal/modules/cjs/loader.js:690:27)
    at Module.require (internal/modules/cjs/loader.js:852:19)
    at require (internal/modules/cjs/helpers.js:74:18)
    at Object. (D:\eclipse 作业\vue-study\myvue\node_modules\webpack-dev-server\bin\webpack-dev-server.js:54:1)
    at Module._compile (internal/modules/cjs/loader.js:959:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:995:10)
    at Module.load (internal/modules/cjs/loader.js:815:32)
    at Function.Module._load (internal/modules/cjs/loader.js:727:14)
    at Function.Module.runMain (internal/modules/cjs/loader.js:1047:10) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'D:\\eclipse 作业\\vue-study\\myvue\\node_modules\\webpack-dev-server\\bin\\webpack-dev-server.js'
  ]
}
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! myvue@1.0.0 dev: `webpack-dev-server --inline --progress --config build/webpack.dev.conf.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the myvue@1.0.0 dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\10721\AppData\Roaming\npm-cache\_logs\2022-09-23T07_45_08_929Z-debug.log

截图

img

img

img

我的解答思路和尝试过的方法

本来下载的是最新版本,后面又降版本,还是运行不起来

咱也是个新手这个笨方法你可以试试,把所以相关环境卸载,找教程视频观看,再根据视频教程安装,这样省的你环境版本不一致导致运行不起来!

npm i webpack-cli@3.3 -D 试下这个版本