题记:学vue有一段时间了,终于今天下定决心每日书写一篇学习笔记。
1.访问node.js官网:https://nodejs.org/en/ 下载对应安装包。

2.安装完成,在终端输入 :

node -v

如果返回版本号,代表安装成功。建议安装之前给目录权限,至于怎么给目录权限,这里不做说明,网上有很多资料。

3.安装淘宝镜像
至于为何要安装淘宝镜像,因为有帐幕阻挡我们访问npm 的境外网站;好奇心强的朋友可以进行尝试,运气差的要很久、很久、有可能一晚上时间,别问我怎么知道的。
废话少说,在终端输入:

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

安装完成输入:

npm -v

查看版本号,正确返回代表安装完成,否在重新来过。

4.安装webpack
以后我们会和webpack打很长时间的交道,创建项目会用到。在终端输入:

cnpm install webpack -g

5.安装vue脚手架
这个工具是自动搭建vue项目框架的工具,还算好用,没得选只此一家。
终端输入:

sudo npm install -g vue-cli

6.等待一段时间,可以去听首歌《福建如你》,这首歌不错,赵照的;咳咳,又跑题了,安装完成后,在终端输入:

vue list

查看详细信息,返回如下代表成功,否,重来。


创建首个vue项目

1.在Mac中创建文件夹,名称自己起,然后在终端打开该目录,也可以用vscode 打开,在终端输入:

sudo vue init webpack vue_project


坐等安装完成。
2.安装成功后切换到在终端中切换到项目根目录

cd vue_peoject

3.安装项目依赖,在终端中输入:

sudo npm install

4.安装依赖完成后,启动项目,在终端或者vscode终端输入:

npm run dev

5.访问http://localhsot:8080,打开vue项目
题外话,相信看到这里,vue项目已经可以正常运行了。大家也有注意到,我基本会用sudo ,为啥呢?在Mac和乌班图下,文件权限很是让人头痛,不加这个命令,会出现各种莫名的问题,为了减少麻烦,当然,我是个懒人,索性都加上,确保万无一失。

Mac下安装和配置Vue项目的更多相关文章

  1. MAC下安装与配置MySQL

    MAC下安装与配置MySQL   MAC下安装与配置MySQL 一 下载MySQL 访问MySQL的官网http://www.mysql.com/downloads/ 然后在页面中会看到“MySQL ...

  2. Mac下安装及配置Appium环境

    candiceli   Mac下安装及配置Appium环境 我是小白,自己研究appium好几周了. 一开始按照同事这篇文章设置Mac下的环境,http://www.cnblogs.com/tangd ...

  3. Mac下安装和配置mongoDB

    mac下的mongodb下载安装比较简单,主要有两种方式,一种是下载压缩包解压,另一种是通过npm或者homebrew命令安装,这里就不赘述了, 复杂的在于mongodb运行环境的配置(若未配置运行环 ...

  4. mac下安装及配置tomcat

    mac下的软件不像windows下的程序那样写注册表,对于tomcat的安装来说,在mac下是名符其实的绿色软件,具体操作如下: 1.到 apache官方主页 下载完整 tar.gz文件包.(没有专门 ...

  5. Mac下安装及配置Eclipse

    1.安装Eclipse前先确认你的Mac上是否已安装java运行环境.进入终端,输入”java -version”,如果返回了java版本号则说明已安装,否则,请先安装java运行环境: 2.访问ec ...

  6. Mac下安装与配置Go语言开发环境

    1.官网下载安装包(需FQ) https://storage.googleapis.com/golang/go1.7.darwin-amd64.pkg 2.配置Go环境变量GOPATH和GOBIN ( ...

  7. Mac 下安装并配置 Tomcat

    1,下载 点击 官网 ,进入下载页面, 2,安装 解压出来,即安装完成. 移动解压后的文件,换个文件目录(方便集中管理),将它改个名字(毕竟名字太长了). 我将其改名为 tomcat9 ,移入资源库目 ...

  8. MAC下安装与配置MySQL [转]

    一 下载MySQL 访问MySQL的官网http://www.mysql.com/downloads/ 然后在页面中会看到“MySQL Community Server”下方有一个“download” ...

  9. Mac下安装和配置Maven

    1.下载Maven 官网:http://maven.apache.org/download.cgi 下载版本:apache-maven-3.5.3-bin.tar.gz 2.配置环境变量 打开term ...

随机推荐

  1. Day9作业:socket之FTP工具

    代码传的太累,直接发个github的链接吧! https://github.com/ccorzorz/Socketserver_FTP 上两张图给抛砖引玉下吧: 后台管理: FTP程序,包括客户端和s ...

  2. Div 居中对齐(水平、垂直)

    一:水平居中对齐 ***********************************************************************************  示例图 代码 ...

  3. C# using语句 中间出现exception后 using仍然会dispose

    C# using语句,中间出现exception后,using仍然会dispose,因为: using语句 相当于 try-finally{dispose()}

  4. 【Leetcode_easy】717. 1-bit and 2-bit Characters

    problem 717. 1-bit and 2-bit Characters 题意:solution1: class Solution { public: bool isOneBitCharacte ...

  5. git的压缩原理;git的pack文件;git gc操作原理;Resolving deltas: 100% (2695/2695), done.做了什么

    文件含义 verify-pack -- validate packed git archive files .git/objects/pack/.pack为压缩后的文件,把.git/objects/下 ...

  6. FineReport点击输入框直接展示下拉框列表

    引用自帆软官方文档-http://help.finereport.com/doc-view-1899.html 1. 描述 下拉框以及下拉复选框默认状态,必须点击最右侧的三角才可以实现下拉,不够人性化 ...

  7. 移动架构-手写ButterKnife框架

    ButterKnife在实际开发中有着大量运用,其强大的view绑定和click事件处理,使得开发效率大大提高,同时增加了代码的阅读性又不影响其执行效率 注解的分类 注解主要有两种分类,一个是运行时, ...

  8. SourceTree使用图解

    看完这篇文档你能做到的是: 1.简单的用Git管理项目. 2.怎样既要开发又要处理发布出去的版本bug情况. SourceTree是一个免费的Git图形化管理工具,mac下也可以安装. 下载地址:ht ...

  9. coverage代码覆盖率的使用~~

    我们看下代码覆盖率的统计~,这个不必太揪心,觉得可以帮助你优化代码,可以看看,也不要带在意~ 1.先在cmd命令窗口在线安装coverage pip install coverage 2.安装完毕后我 ...

  10. 推荐:【视频教程】ASP.NET Core 3.0 入门

    墙裂推荐了,免费,通俗易懂,唯一可惜的就是不是我录的,更可惜的是人家录制完了快半年了我还没看完... 版权归原作者所有,建议新手还是边看边实践吧,要不然过完一遍发现自己啥也没学会,不要眼高手低 [视频 ...