昨晚,在教我前端交流群里面的朋友搭建vue开发环境和构建vue项目的时候发现我自己之前能正常构建vue项目的现在却不行了,排查之下发现

通过脚手架构建项目的时候项目缺失了node_modules文件夹,在我排除了node环境、和配置的环境变量、vue-cli和webpack等一切都没有问题的情况下

差点重新删除node环境和vue脚手架等重装了,但是幸亏我多看了几眼cmd, 发现了貌似是和package-lock.json有关,于是我尝试通过:

npm install express 来解决问题,结果是 node_modules文件夹已经出来了,但是依然没有办法通过  npm run dev  正常运行

于是继续 npm install  发现还是不行,后来发现其实问题很简单,

 npm install的执行过程是这样的:

  1. 发出npm install命令

  2. npm 向 registry 查询模块压缩包的网址

  3. 下载压缩包,存放在(本地NPM缓存路径)目录

  4. 解压压缩包到当前项目的node_modules目录

  也就是说一个模块安装以后,本地其实保存了两份。一份是 npm 目录下的压缩包,另一份是 node_modules 目录下解压后的代码。但是,运行 npm install 的时候,只会检查 node_modules 目录,而不会检查 npm 目录。如果一个模块在 npm 下有压缩包,但是没有安装在 node_modules 目录中,npm 依然会从远程仓库下载一次新的压缩包。

  利用已经在缓存中,之前已经备份的模块实现离线模块安装的 cache 机制已经在V5的时候重写了,缓存将由 npm 来全局维护,不再需要开发人员操心,离线安装时将不再尝试连接网络,而是降级尝试从缓存中读取,或者直接失败。就是如果你 offline(离线) ,npm将无缝地使用您的缓存。

  所以解决办法就是执行命令清除缓存,npm cache clean --force 命令就是清除这种缓存的,

在执行清除命令之后再重新 npm  install 初始化项目(如果卡住一直不动,可以重新 npm install 重新初始),初始化成功之后再通过 npm run dev 就可以正常运行了

由于解决问题的时候没有截图,所以只能使用文字来描述。

在解决了之后以后的项目就可以通过普通的方法构建项目了,直到再次出现这样的问题才需要进行上面的操作。

解决使用脚手架构建项目缺失node_modules文件夹文件问题的更多相关文章

  1. java实现基于关键字的文件夹(文件)的搜索、文件夹(文件)的复制、删除

    最近在做一个项目,需要实现这几项功能,上网查了很多资料,自己研究了好几天终于实现了,现在与大家分享一下. 一.JAVA实现文件夹的搜索   在百度搜索N个技术文章,从哪些大牛们共享的资料中终于写出了我 ...

  2. python 遍历文件夹 文件

    python 遍历文件夹 文件   import os import os.path rootdir = "d:\data" # 指明被遍历的文件夹 for parent,dirn ...

  3. android多国语言文件夹文件汇总

    android多国语言文件夹文件汇总如下: 中文(中国):values-zh-rCN 中文(台湾):values-zh-rTW 中文(香港):values-zh-rHK 英语(美国):values-e ...

  4. java基础IO删除文件夹文件

    /** * 定义一个方法,能够删除任意文件夹,文件夹路径由键盘录入 注意:不要在C盘下做测试,请选定无用的文件夹测试! */ 1.键盘录入 private static File getfile() ...

  5. PHP文件夹文件拷贝/复制函数 dir_copy($src = '', $dst = '')

    /* * 文件夹文件拷贝 * * @param string $src 来源文件夹 * @param string $dst 目的地文件夹 * @return bool */ function dir ...

  6. JavaSE 文件递归之删除&获取文件夹文件夹中全部的以.jpg的文件的绝对路径

    1.递归删除文件 假设一个文件夹以下还有子文件夹,进行删除的话会 报错,这个时候要使用递归的方式来删除这个文件文件夹中的全部文件以及文件夹 package cn.itcast.digui; impor ...

  7. Shell脚本递归打印指定文件夹中全部文件夹文件

    #!/bin/bash #递归打印当前文件夹下的全部文件夹文件. PRINTF() { ls $1 | while read line #一次读取每一行放到line变量中 do [ -d $1/$li ...

  8. C#获取文件夹/文件的大小以及占用空间 转摘自:http://www.cnblogs.com/chenpeng-dota/articles/2176470.html

    C#获取文件夹/文件的大小以及占用空间 今天,头给了个任务:写个方法,我会给你个路径,计算这个路径所占用的磁盘空间 . 然后,找了很多资料.但大部分都是获取文件夹/文件的大小的.对于占用空间的没有成品 ...

  9. vue学习记录①(vue-cli脚手架构建项目结构)

    我们直接从vue的工程化开始入手. 在这里用git命令行搭建项目环境.(当然直接cmd命令行下也是一样的) git下载安装地址:https://www.git-scm.com/download/win ...

随机推荐

  1. JS中数组的拷贝方法

    之前在写一个vue的计算属性时,大概是这样: computed: { updateList () { let newList = this.List /*do something*/ return n ...

  2. UnityEventSystem

    能够处理各种UI事件: IPointerEnterHandler:当指针进入 void OnPointerEnter(PointerEventData eventData); IPointerExit ...

  3. 基于Python对象引用、可变性和垃圾回收详解

    基于Python对象引用.可变性和垃圾回收详解 下面小编就为大家带来一篇基于Python对象引用.可变性和垃圾回收详解.小编觉得挺不错的,现在就分享给大家,也给大家做个参考. 变量不是盒子 在示例所示 ...

  4. python 使用 with open() as 读写文件

    读文件: 要以读文件的模式打开一个文件对象,使用Python内置的open()函数,传入文件名和标示符: >>> f = open('E:\python\python\test.tx ...

  5. Go语言入门篇-基本类型排序和 slice 排序

    参见博客:https://blog.csdn.net/u010983881/article/details/52460998 package main import ( "sort" ...

  6. call 和 apply的定义和区别?

    1.方法定义 call方法: 语法:call([thisObj[,arg1[, arg2[,   [,.argN]]]]]) 定义:调用一个对象的一个方法,以另一个对象替换当前对象. 说明: call ...

  7. Express中间件body-parser

    在http请求种,POST.PUT.PATCH三种请求方法中包含着请求体,也就是所谓的request,在Nodejs原生的http模块中,请求体是要基于流的方式来接受和解析. body-parser是 ...

  8. Lock和synchronized的区别和使用(转发)

    今天看了并发实践这本书的ReentantLock这章,感觉对ReentantLock还是不够熟悉,有许多疑问,所有在网上找了很多文章看了一下,总体说的不够详细,重点和焦点问题没有谈到,但这篇文章相当不 ...

  9. Jmeter学习总结

    学习内容: 1.用户定义的变量 作用:多个地方使用同一个值,且该值在不同的环境下不同,方便脚本在不同环境下运行时修改. 2.基本的HTTP请求,请求方式:get 3.传入参数为json 4.HTTP信 ...

  10. Kafka在windows下的配置使用

    Kafka是最初由Linkedin公司开发,是一个分布式.支持分区的(partition).多副本的(replica),基于zookeeper协调的分布式消息系统,它的最大的特性就是可以实时的处理大量 ...