专栏首页俞其荣的博客Vue.js安装教程安装步骤安装中遇到的问题

Vue.js安装教程安装步骤安装中遇到的问题

安装步骤

  1. 安装 node.js (网址:https://nodejs.org/en/)。
  2. 基于 node.js ,利用淘宝 npm 镜像安装相关依赖。在 cmd 里直接输入:npm install -g cnpm –registry=https://registry.npm.taobao.org,回车,等待安装。
  3. 安装全局 vue-cli 脚手架,用于帮助搭建所需的模板框架,在 cmd 里
    1. 输入:cnpm install -g vue-cli,回车,等待安装;
    2. 输入: vue ,回车,若出现 vue 信息说明表示成功。
  4. 创建项目,在 cmd 里输入:vue init webpack vue_test(项目文件夹名) ,回车,等待一小会儿,依次出现下列选项,输入后创建成功。

create vue project

  1. 安装依赖,在 cmd 里
    1. 输入:cd vue_test ,回车,进入到具体项目文件夹
    2. 输入:npm install,回车,等待一小会儿,安装依赖。
  2. 测试环境是否搭建成功
    1. 在 cmd 里输入:npm run dev
    2. 在浏览里输入:localhost:8080(默认端口为8080)

    运行起来后的效果如下图所示:

Vue running

安装中遇到的问题

vue init webpack vue_test

C:\Users\h\Desktop>vue init webpack vue_test
C:\Users\h\AppData\Roaming\npm\node_modules\vue-cli\bin\vue-init:60
let template = program.args[0]
^^^

SyntaxError: Block-scoped declarations (let, const, function, class) not yet sup
ported outside strict mode
    at exports.runInThisContext (vm.js:54:16)
    at Module._compile (module.js:375:25)
    at Object.Module._extensions..js (module.js:406:10)
    at Module.load (module.js:345:32)
    at Function.Module._load (module.js:302:12)
    at Function.Module.runMain (module.js:431:10)
    at startup (node.js:141:18)
    at node.js:977:3

nodejs版本太低,去官网更新即可。

npm install

C:\Users\h\Desktop\vue_test>npm install

> chromedriver@2.33.2 install C:\Users\h\Desktop\vue_test\node_modules\chromedri
ver
> node install.js

Downloading https://chromedriver.storage.googleapis.com/2.33/chromedriver_win32.
zip
Saving to C:\Users\h\AppData\Local\Temp\chromedriver\chromedriver_win32.zip
ChromeDriver installation failed Error with http(s) request: Error: connect ETIM
EDOUT 172.217.160.112:443
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.1.3 (node_modules\fse
vents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@
1.1.3: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"}
)

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! chromedriver@2.33.2 install: `node install.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the chromedriver@2.33.2 install script.
npm ERR! This is probably not a problem with npm. There is likely additional log
ging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\h\AppData\Roaming\npm-cache\_logs\2017-11-25T07_25_19_228Z
-debug.log

因为 chromedriver 被墙了,所以需要输入命令 cnpm install chromedriver ,安装 chromedriver 。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 使用OpenCV对图片进行二值化和去燥处理

    最近做的项目中有使用到 OpenCV ,并且利用了 OpenCV 对图片做一些简单的处理。所以今天打算记录一下一些常用的 OpenCV 操作。

    俞其荣
  • Android Architecture Component之LiveData解析HeaderLiveDataFooter

    Android Architecture Component 是 Google 在 2017 年推出的一套帮助开发者解决 Android 架构设计的方案。里面有...

    俞其荣
  • 从SVN迁移到GitLab

    之前公司代码版本管理用的都是 SVN ,最近搭了 GitLab 。所以想把代码从 SVN 迁移到 GitLab 上。但是 SVN 的提交记录又不能丢,也要跟着一...

    俞其荣
  • 《vue+vant+node+mongoDB+koa2》电商项目实战连载(1)

    每节课程规划是大概12-15分钟左右,是以功能点来划分课程的节奏。预计总课时数大概40节左右吧,看实际情况吧。

    web前端教室
  • (Vue全家桶)Vue-cli

    安装vue-cli的前提是你已经安装了npm,安装npm你可以直接下载node的安装包进行安装。你可以在命令行工具里输入npm -v 检测你是否安装了npm和...

    楠楠
  • Vue笔记:使用node开发vue入门实例

    首先在命令终端输入 npm -v 检测是否安装 npm。如果没有,按照下面教程进行安装。

    朝雨忆轻尘
  • vue2.0的简单搭建

    vue作为前端三大主流框架之一,没有ng早,也没有React的完善,但是vue的好处是集众家之所长(关键还是中国人自己开发的)

    我乃小神神
  • 关于npm install失败的解决方法

    試毅-思伟
  • npm WARN deprecated socks@1.1.10: If using 2.x branch, please upgrade to at least 2.1.6

    使用npm install cnpm -g --registry=https://registry.npm.taobao.org命令的时候就会出现下图中的WAR...

    北京-宏哥
  • Node异常笔记

    解决方案: 将设置的prefix路径(如 F:\nodejs\node_global)添加到环境变量Path即可。

    汐楓

扫码关注云+社区

领取腾讯云代金券