windows系统安装VUE 踩地雷合集

首先是下载一个node.js安装包。目前就下最新的吧。(下载最新版本可能要降版本),然后安装cnpm的淘宝镜像。安装之前建议参阅npm的安装机制

本文档参考自:Jinkey原创Vue2.0 新手完全填坑攻略gh254172840的博客

npm install -g cnpm --registry=https://registry.npm.taobao.org

如果你是最新版本会报错:

npm WARN deprecated [email protected]: If using 2.x branch, please upgrade to at least 2.1.6 to avoid a serious bug with socket data flow and an import issue introduced in 2.1.0

解决办法:降低版本:

npm install [email protected]4.6.1 -g

然后安装webpack和脚手架(一步步来):

cnpm install webpack -g
npm install vue-cli -g

在硬盘上找一个文件夹放工程用的,在终端中进入该目录

cd 目录路径
或者
cd /d 目录路径

根据模板创建项目

vue init webpack-simple 工程名字<工程名字不能用中文>
或者创建 vue1.0 的项目
vue init webpack-simple#1.0 工程名字<工程名字不能用中文>

会有一些初始化的设置,如下输入:
Target directory exists. Continue? (Y/n)直接回车默认(然后会下载 vue2.0模板,这里可能需要连代理)
Project name (vue-test)直接回车默认
Project description (A Vue.js project) 直接回车默认
Author 写你自己的名字

cd 命令进入创建的工程目录再安装项目依赖

这次是在项目里面安装而不是全局安装npm、cnpm路由模块以及网络模块,一步步来:

npm install
cnpm installcnpm install vue-router vue-resource --save

装npm的时候可能会报错

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected]^1.0.0 (node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

这只是一个警告,因为该模块与Windows不兼容。你可以放心地忽略它。这是可选的。

如果是这样不断的ERR:

这种是node_modules安装问题,执行以下(参考文档):

rd /s /q node_modules
rd /s /q package-lock.json
npm cache clear --force
npm install

  

没有报错,那么可喜可贺进行下一步。如果你用的是老版本的 vue-cli 还可能报其他错误,需要更新一下 vue-cli:

npm update vue-cli

最后启动项目

npm run dev

然后安装其它依赖。

cnpm install opn --save-dev
cnpm install webpack-dev-middleware --save-dev
cnpm install express --save-dev
cnpm install compression --save-dev
cnpm install sockjs --save-dev
cnpm install spdy --save-dev
cnpm install http-proxy-middleware --save-dev
cnpm install serve-index --save-dev
cnpm install connect-history-api-fallback --save-dev

其中webpack-dev-middleware会报错:

peerDependencies WARNING [email protected]* requires a peer of [email protected]^4.0.0 but [email protected] was installed

我暂时无视掉了。

其它坑见:runoob.com

原文地址:https://www.cnblogs.com/a5211083/p/9023110.html

时间: 2024-10-21 03:10:28

windows系统安装VUE 踩地雷合集的相关文章

移动端踩坑合集

前段时间在小密圈和大家分享我的感受,H5代替客户端进行移动端开发,是大趋势.未来较长一段时间,是混合应用的天下.然而H5写移动页面,那绝对是一步一个坑的节奏啊,做好各设备的兼容将是各前端er的重要使命.今天给大家送上一个合集,是我最近开发中遇到的一些坑,作个记录,也给大家一些经验. 1. babel-polyfill老实加上.现在很多项目都用ES6在写了,ES6在移动端的兼容也天生较好.有些同学嫌弃polyfill文件太大(压缩后也将近100KB)就不引了,反正用到的方法也不多. 然而最近发现项

VUE相关资料合集

===官方=== https://github.com/vuejs/vue vue-components组件库 ---PC端--- https://github.com/ElemeFE/element Vue2.0 PC端UI组件库 https://github.com/iview/iview 一套基于 Vue.js 的高质量 UI 组件库 https://github.com/jackbarham/vuejs-style-guide Vue UI框架 vibecast UI风格 https:/

项目中遇到的better-scroll的踩坑合集及搜罗的解决办法

x1 > < >> << O better-scroll 是一款重点解决移动端(已支持 PC)各种滚动场景需求的插件.它的核心是借鉴的 iscroll 的实现.better-scroll 基于原生 JS 实现的,不依赖任何框架,所以使用起来也十分的方便. 注意点: 使用时better-scroll是作用在外层的wrapper容器上的,滚动的部分是content---需要注意的是,better-scroll只处理容器的第一个子元素,其他的元素会被忽略,如果里面需要滚动的部

Vim命令合集

来源:Vim命令合集 命令历史 以:和/开头的命令都有历史纪录,可以首先键入:或/然后按上下箭头来选择某个历史命令. 启动vim 在命令行窗口中输入以下命令即可 vim 直接启动vim vim filename 打开vim并创建名为filename的文件 文件命令 打开单个文件 vim file 同时打开多个文件 vim file1 file2 file3 ... 在vim窗口中打开一个新文件 :open file 在新窗口中打开文件 :split file 切换到下一个文件 :bn 切换到上一

[转载]VIM命令合集

Vim命令合集 http://www.cnblogs.com/softwaretesting/archive/2011/07/12/2104435.html 命令历史 以:和/开头的命令都有历史纪录,可以首先键入:或/然后按上下箭头来选择某个历史命令. 启动vim 在命令行窗口中输入以下命令即可 vim 直接启动vim vim filename 打开vim并创建名为filename的文件 文件命令 打开单个文件 vim file 同时打开多个文件 vim file1 file2 file3 ..

前端资源教程合集

综合类 前端知识体系 前端知识结构 Web前端开发大系概览 Web前端开发大系概览-中文版 Web Front-end Stack v2.2 En类资源汇总 免费的编程中文书籍索引 前端书籍 前端免费书籍大全 前端知识体系 免费的编程中文书籍索引 智能社 - 精通JavaScript开发 重新介绍 JavaScript(JS 教程) 麻省理工学院公开课:计算机科学及编程导论 JavaScript中的this陷阱的最全收集--没有之一 JS函数式编程指南 JavaScript Promise迷你书

转载:2013计算机视觉代码合集

转载,原文地址http://blog.csdn.net/daoqinglin/article/details/23607079 -------------------------------------------------------------------------- 来源: http://www.yuanyong.org/cv/cv-code-one.html http://www.yuanyong.org/cv/cv-code-two.html http://www.yuanyong

[题解+总结]动态规划大合集II

1.前言 大合集总共14道题,出自江哥之手(这就没什么好戏了),做得让人花枝乱颤.虽说大部分是NOIP难度,也有简单的几道题目,但是还是做的很辛苦,有几道题几乎没思路,下面一道道边看边分析一下. 2.lis 最长上升子序列 唯一一道裸题,但是O(n^2)过不了,临时看了看O(n log n)的二分做法和线段树做法.先来讲讲简单的二分做法,其本质就是在O(n^2)上进行优化,需要证明一个结论.设当前处理数列第k位,存在: (1)a[i]<a[j]<a[k]: (2)i<j<k: (3

Python渗透测试工具合集

Python渗透测试工具合集 如果你热爱漏洞研究.逆向工程或者渗透测试,我强烈推荐你使用 Python 作为编程语言.它包含大量实用的库和工具, 本文会列举其中部分精华. 网络 Scapy, Scapy3k: 发送,嗅探,分析和伪造网络数据包.可用作交互式包处理程序或单独作为一个库. pypcap, Pcapy, pylibpcap: 几个不同 libpcap 捆绑的python库 libdnet: 低级网络路由,包括端口查看和以太网帧的转发 dpkt: 快速,轻量数据包创建和分析,面向基本的