vue之webpack -v报错解决方案总结

小白学习一下vue,然后了解到了webpack相关的知识,然后就各种安装

cnpm 是国内的源相比国际源要快很多,不知道cnpm的自己查一下吧。

cnpm install -g webpack

等一会安装成功了,我就想看一下webpack 的版本

又提示我要安装webpack-cli,那就安装吧

cnpm install -g webpack-cli

等一会就安装好了,再看一下webpack -v就报下面的错了。

$ webpack -v
C:\Users\Administrator\AppData\Roaming\npm\node_modules\webpack-cli\lib\groups\resolveConfig.js:105
        for await (const resolvedOption of finalizedConfigs) {
            ^^^^^
SyntaxError: Unexpected reserved word
    at NativeCompileCache._moduleCompile (C:\Users\Administrator\AppData\Roaming\npm\node_modules\webpack-cli\node_modules\_v8-compile-cache@2.2.0@v8-compile-cache\v8-compile-cache.js:240:18)
    at Module._compile (C:\Users\Administrator\AppData\Roaming\npm\node_modules\webpack-cli\node_modules\_v8-compile-cache@2.2.0@v8-compile-cache\v8-compile-cache.js:184:36)
    at Object.Module._extensions..js (module.js:664:10)
    at Module.load (module.js:566:32)
    at tryModuleLoad (module.js:506:12)
    at Function.Module._load (module.js:498:3)
    at Module.require (module.js:597:17)
    at require (C:\Users\Administrator\AppData\Roaming\npm\node_modules\webpack-cli\node_modules\_v8-compile-cache@2.2.0@v8-compile-cache\v8-compile-cache.js:159:20)
    at Object.<anonymous> (C:\Users\Administrator\AppData\Roaming\npm\node_modules\webpack-cli\lib\webpack-cli.js:14:32)
    at Module._compile (C:\Users\Administrator\AppData\Roaming\npm\node_modules\webpack-cli\node_modules\_v8-compile-cache@2.2.0@v8-compile-cache\v8-compile-cache.js:192:30)

使用npm list --depth=0 -g 看一看安装了哪些个包。
也打印了各版本,但报两个错,做为多年程序员的我看着好是不爽。

$ npm list --depth=0 -g
C:\Users\Administrator\AppData\Roaming\npm
+-- cnpm@6.1.1
+-- vue-cli@2.9.6
+-- webpack@4.19.0
`-- webpack-cli@4.2.0

npm ERR! error in C:\Users\Administrator\AppData\Roaming\npm\node_modules\webpack-cli\node_modules\_@webpack-cli_info@1.1.0@@webpack-cli: ENOENT: no such file or directory, open 'C:\Users\Administrator\AppData\Roaming\npm\node_modules\webpack-cli\node_modules\_@webpack-cli_info@1.1.0@@webpack-cli\package.json'
npm ERR! error in C:\Users\Administrator\AppData\Roaming\npm\node_modules\webpack-cli\node_modules\_@webpack-cli_serve@1.1.0@@webpack-cli: ENOENT: no such file or directory, open 'C:\Users\Administrator\AppData\Roaming\npm\node_modules\webpack-cli\node_modules\_@webpack-cli_serve@1.1.0@@webpack-cli\package.json'

于是仔细看了一下,是缺少package.json文件,那就新建一个,然后报错无法读取,空内容当然无法读取了,在提示没有文件的路径其他目录下找到了这个文件,就复制到这一级,尝试了一下查看各包的版本,不报错了,但webpack -v 依然不好用,报上面的错误,我想可能是webpack和webpack-cli版本不对应的问题。

查看版本的命令:

cnpm view webpack versions

打印的版本太多就不放在这里了,我一看我本机的版本是4.19.0最新的都5.4.0了,、

cnpm view webpack-cli versions

webpack-cli最新的是 4.2.0。

大概是出在了版本不对称上了。

那我就把 webpack-cli卸载了再安装一下吧。

cnpm uninstall weabpack-cli

只打印了 up to date in 0.029s ,好像不太好使,使用 npm list --depth=0 -g 发现webpack-cli@4.2.0还在。

那我就查了一下如何安装指定版本的webpack-cli

在刚才看过的版本中找一个老一点的

cnpm install -g webpack-cli@3.3.10

等一会安装成功后

查看一下npm list --depth=0 -g 下,打印正常,不报错了。

$ npm list --depth=0 -g
C:\Users\Administrator\AppData\Roaming\npm
+-- cnpm@6.1.1
+-- vue-cli@2.9.6
+-- webpack@4.19.0
`-- webpack-cli@3.3.10

然后再使用一下webpack -v,也不报错了,能正常展示

$ webpack -v
4.19.0

至此爬坑成功~

很早以前就看过node.js不同版本的坑很多的文章,使用npm管理的各工具版本间也这么坑,我还没学会,就要学废了,程序员之路好难!!!

到此这篇关于vue之webpack -v报错解决方案总结的文章就介绍到这了,更多相关vue之webpack -v报错内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • Webpack-cli安装成功后查看webpack -v报错案例详解

    目录 问题 1. 安装webpack webpack-cli 2. 查看webpack 版本 解决 1. 查看node版本 2. 升级npm 3. 查看webpack版本 问题 1. 安装webpack webpack-cli npm install -g webpack webpack-cli 2. 查看webpack 版本 webpack -v 报错 /usr/local/lib/node_modules/webpack/lib/cli.js:66 .replace( ^ SyntaxErr

  • webpack -v报错解决方案

    背景 想查看下webpack版本,但执行webpack -v报错 解决方案 步骤一:运行命令npm list --depth=0 -g 检测下webpack.webpack-cli等版本兼容情况 例如以上提示,你安装了webpack-dev-server@4.1.0版本,但你的webpack版本不匹配(提示版本过低),需安装v4.37.0以上的版本,或者直接安装v5.0.0版本(例如直接安装v4.37.0版本:npm install -g webpack@4.37.0) 步骤二:再次运行命令np

  • electron-vue利用webpack打包实现多页面的入口文件问题

    项目需要在electron的项目中新打开一个窗口,利用webpack作为静态资源打包器,发现在webpack中可以设置多页面的入口,今天来讲一下我在electron中利用webpack建立多页面入口的踩坑经验. 1.webpack的核心概念 •Entry:入口,Webpack执行构建的第一步从Entry开始: •Module:模块,在Webpack里一切皆模块,一个模块对应着一个文件.Webpack会从配置的Entry开始递归找出所有依赖的模块. •Chunk:代码块,一个Chunk由多个模块组

  • vue之webpack -v报错解决方案总结

    小白学习一下vue,然后了解到了webpack相关的知识,然后就各种安装 cnpm 是国内的源相比国际源要快很多,不知道cnpm的自己查一下吧. cnpm install -g webpack 等一会安装成功了,我就想看一下webpack 的版本 又提示我要安装webpack-cli,那就安装吧 cnpm install -g webpack-cli 等一会就安装好了,再看一下webpack -v就报下面的错了. $ webpack -v C:\Users\Administrator\AppDa

  • 解决Vue项目中tff报错的问题

    在webpack.config.js中的模块配置中加如下的配置规则: {test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/, use: "url-loader"} const path = require('path'); const htmlWebpackplugin = require('html-webpack-plugin'); const VueLoaderPlugin = require('vue-loader/lib/plugin'); modu

  • C#中SQL参数传入空值报错解决方案

    C#中的null与SQL中的NULL是不一样的,SQL中的NULL用C#表示出来就是DBNull.Value. 注意:SQL参数是不能接受C#的null值的,传入null就会报错. 下面我们看个例子: SqlCommand cmd=new SqlCommand("Insert into Student values(@StuName,@StuAge)" ,conn); cmd.parameters.add("@StuName" ,stuName); cmd.para

  • 解决vue 引入子组件报错的问题

    错误信息: Do not use built-in or reserved HTML elements as component id: header 源码: <script> import header from "./components/header" import aside from "./components/aside" import footer from "./components/footer" export de

  • Springboot项目因为kackson版本问题启动报错解决方案

    问题现象 org.springframework.context.ApplicationContextException: Unable to start embedded container; nested exception is org.springframework.boot.context.embedded.EmbeddedServletContainerException: Unable to start embedded Tomcat     at org.springframew

  • python -v 报错问题的解决方法

    解决python -v报错问题的方法: 在cmd命令行中输入"python -v"报错是因为没有将python的安装路径添加到系统环境变量path中,将python的安装路径添加进去就可以了 示例如下: 输入python -v结果: 到此这篇关于python -v 报错问题的解决方法的文章就介绍到这了,更多相关如何解决python -v 报错问题内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

  • 使用Sqlyog远程连接数据库报错解决方案

    目录 前言 解决方案 总结 前言 远程连接linux上的mysql时,报了下面这样的错误 数据库远程连接失败 这是因为我们的主机没有足够的权限去连接linux上的数据库 解决方案 1.1 使用root用户登录数据库 mysql -uroot -p<密码> 1.2切换到mysql数据库 use mysql 1.3 查询user表中的root用户的localhost信息 select user,host from user; 1.4 修改localhost信息 update user set ho

  • Eclipse新建Android项目报错解决方案详细汇总

    本文记录刚接触Android开发搭建环境后新建工程各种可能的报错,并亲身经历漫长的解决过程(╥╯^╰╥),寻找各种偏方,避免大家采坑,希望能帮助到大家. 出错一:The import android.support cannot be resolved类型解决 如图,如果报The import android.support cannot be resolved或者android.support.v7.app.ActionBarActivity类似的错误. 解决方案一 :缺少相关依赖包,这里提供

随机推荐

其他