当半年不碰的webpack + vuejs项目重见天日时遇到的神坑！

半年前的Vuejs项目，由于webpack环境一直是1.0的，倒不是说不会改和不敢改。

总而言之。在我再次启动这个项目时： npm run dev / npm run build

不断的报出缺少某些模块的错误，起初我无所在乎的按着指导一个一个下载，下载了几个之后。我忽然发觉不对劲。

后来怀疑是webpack新版本的问题。将全局重装回了1.X版本。后来才知道这是错的。因为编译的版本是根据当前项目的webpack来的。也就是说我确实使用的是1.0版本来编译。而且报错了。

再后来我以为是nodejs升级的版本太高以至于不稳定。立刻找了个稳定的版本重装。结果还是错误的。

在万般无奈之下。我又使用了npm来安装（由于墙的问题，我几乎都是使用cnpm来安装，或许是它的问题呢？）。结果是，TM的npm依然有不少问题导致我模块都下不完整。

直接说结果吧：

我删除了整个node_modules，然后使用cnpm install 。经过漫长的等待，安装完成

执行npm run dev / npm run build

成功！

时间： 2024-11-05 19:36:38

当半年不碰的webpack + vuejs项目重见天日时遇到的神坑！的相关文章

webpack vuejs项目学习心得

最近在做移动端的项目,最近webpack和vuejs很火,就想到了用vuejs webpack来构建我的项目先了解了一些webpack的入门基础 http://webpack.github.io/docs/ webpack官方文档 https://zhuanlan.zhihu.com/p/20367175 webpack傻瓜式入门一 https://zhuanlan.zhihu.com/p/20397902 傻瓜式入门(二) 看完入门教程,懂得了webpack的一些基本配置和插件的使用.

使用nodejs、ejsExcel、express、vuejs编写一个excel转json的工具——第一步：创建一个包含webpack的vuejs项目

最近开发一个h5的游戏,需要一个excel转json的工具,网上找了找,没有发现适合的工具.想到自己之前用nodejs.express和vuejs做过一个网站,也用过ejsExcel插件,于是自己动手做了一个.这里简单的记录一下开发过程,给自己留个纪念. 这是本系列的第一篇博客,从新建项目开始吧. 1.需要按照nodejs和vuejs 安装的方法这里不提了,网上找一找,教程很多. 安装好了可以看一下nodejs.vuejs和express的版本号: 2.使用vuejs创建一个带webpack的项

vue-cli的webpack模板项目配置文件分析

由于最近在vue-cli生成的webpack模板项目的基础上写一个小东西,开发过程中需要改动到build和config里面一些相关的配置,所以刚好趁此机会将所有配置文件看一遍,理一理思路,也便于以后修改配置的时候不会"太折腾". 一.文件结构本文主要分析开发(dev)和构建(build)两个过程涉及到的文件,故下面文件结构仅列出相应的内容. ├─build │ ├─build.js │ ├─check-versions.js │ ├─dev-client.js │ ├─dev-ser

Vue2+VueRouter2+webpack 构建项目实战（二）：目录以及文件结构

通过上一篇博文<Vue2+VueRouter2+webpack 构建项目实战(一):准备工作>,我们已经新建好了一个基于vue+webpack的项目.本篇文章详细介绍下项目的结构. 项目目录以及文件结构如图所示: 如上图所示,自动构建的vue项目的结构就是这样. 目录/文件说明 build 这个是我们最终发布的时候会把代码发布在这里,在开发阶段,我们基本不用管. config 配置目录,默认配置没有问题,所以我们也不用管 node_modules 项目开发依赖的一些模块 src 开发目录(

[F2016061802] NodeJS之旅-使用webpack构建项目时代码正确但编译出错

遇到这个问题前,我对webpack还不算太熟,仅仅限于用它来编译ES6代码,代码写多了,问题也就来了. 一开始用NodeJS写些小项目,用的模块并不多,遇到些报错问题,改改也就通过了.然而,随着用的第三方模块增多,用webpack构建项目时出现错误的次数越来越多,最奇怪的是:代码检查了十几遍,明明任何错误都没有,编译却通不过.最后只能硬着头皮去看编译后的代码才明白问题出在哪里! 对于webpack,它是自动把依赖都输出到目标文件中.比如: import koa from 'koa' 构建后的输出

webpack 构建项目入门

参考http://www.cnblogs.com/eyunhua/p/6398885.html --------------------------------------------------------------------- 已安装node.js,利用npm输入命令全局安装(-g) npm install webpack -g 安装完后,输入 webpack -v 查看当前webpack的版本号. 正式使用Webpack 进入项目目录,输入命令:npm init,生成package

Vue2+VueRouter2+webpack 构建项目实战（三）：配置路由，运行页面

制作.vue模板文件通过前面的两篇博文的学习,我们已经建立好了一个项目.问题是,我们还没有开始制作页面.下面,我们要来做页面了. 我们还是利用 http://cnodejs.org/api 这里公开的api来做项目.不过本章节不涉及调用接口等内容.这里,我们假设我们的项目是做俩页面,一个列表页面,一个内容页面.列表页面有分页等,内容页面展示. 因此,我们需要两个模板文件. 我们在src/page目录下面新建两个文件,分别是index.vue和content.vue index.vue代码: <

webpack构建项目

webpack构建项目源码戳这里 ps:每个案例对应相应的demo,例如"案例1"对应"demo1" 一.webpack基本功能及简单案例安装webpack $ npm i webpack -g 基本功能 $ webpack -v 查看webpack版本号 $ webpack 最基本的启动webpack的方法 $ webpack -w 提供watch方法:实时进行打包更新 $ webpack -p 对打包后的文件进行压缩 $ webpack -d 提供sourc

一步一步建立 webpack 4 项目

一步一步建立 webpack 4 项目 cnpm init -y cnpm i webpack --save-dev cnpm i webpack-cli --save-dev 修改 package.json scripts 加入以下代码 "scripts": { "build": "webpack --mode=production", "dev": "webpack --mode=development"