如何在mac上运行vue项目

使用终端安装Vue运行环境

1、安装 Homebrew

Homebrew 是osx下面最优秀的包管理工具,没有之一。先在终端查看是否已安装brew

brew -v

如果返回 Homebrew 的版本号 例如:Homebrew 1.3.6 那么恭喜你,可以跳过这一步,如果没有,那就乖乖执行第一步。

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

2、安装 node.js

为了避免使用brew命令经常出错的情况,所以采用手动安装 

下载地址:https://nodejs.org/en/download/     (选择mac os)

确认node是否安装成功。

node -v 

3、 获取nodejs模块安装目录访问权限 (必须执行)

sudo chmod -R 777 /usr/local/lib/node_modules/

4、安装 淘宝镜像 (cnpm)

ps: Node 的模块管理器 npm 会一起安装好,不需要另外安装,查看npm的版本

npm -v

如果版本太低,小于4.0,请执行下面命令升级(vue-cli需要npm版本大于4.0)

npm install -g npm

Node 的官方模块仓库网速太慢,用下面的命令替代上面的

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

5、安装webpack

sudo cnpm install webpack -g

这里需要注意一点使用上面语法,执行npm run dev 报错! MAC电脑出现 .bin/webpack-dev-server permission denied 提示权限问题,为了避免出现这个问题可以采取下面语法:

sudo cnpm install webpack-dev-server -g 

6、安装vue脚手架 vue-cli

选择全局安装(npm下载速度超级慢,目前cnpm已经成功替代npm)

sudo cnpm install -g vue-cli

安装成功后,vue命令查看

使用vue list查看vue的模板

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

cd 目录路径

8、创建一个vue.js工程(项目)

vue init webpack(使用哪个模板?可以百度查看) 项目名称 (项目名称不能用中文)

过程中需要填写一些信息,项目名称、项目描述、是否需要安装vue-router、是否使用ESLint即新的js语法标准,检测你的代码。由于只是测试项目,unit test单元测试和ese tests 在这里都选了no

9、安装项目依赖

一定要从官方仓库安装,npm 服务器在国外所以这一步安装速度会很慢。

npm install  (会非常慢)

cnpm install  

进入项目,查看当前目录结构

node_modules是安装依赖成功后新增的一个目录

10、安装 vue 路由模块vue-router和网络请求模块vue-resource

cnpm install vue-router vue-resource --save

11、启动项目

npm run dev

cnpm run dev

项目启动成功后,命令行会给出在浏览器中查看项目效果的地址

ep: > Listening at http://localhost:8080 (或其它端口)

原文地址:https://www.cnblogs.com/vikeykuo/p/vue.html

时间: 2024-10-09 16:52:27

如何在mac上运行vue项目的相关文章

【无私分享:ASP.NET CORE 项目实战(第十章)】发布项目到 Linux 上运行 Core 项目

目录索引 [无私分享:ASP.NET CORE 项目实战]目录索引 简介 ASP.Net Core 给我们带来的最大的亮点就是跨平台,我在我电脑(win7)上用虚拟机建了个 CentOS7 ,来演示下,我们windows上的项目如何发布项目到Linux上运行.我这里有个在windows上搭建过的程序,我们主要演示如何在linux上运行,所以大家不要纠结于这些,大家可以新建一个web项目尝试一下. 安装.NET Core SDK for CentOS 微软有详细的安装命令,可以参考Install

发布项目到 Linux 上运行 Core 项目

发布项目到 Linux 上运行 Core 项目 目录索引 [无私分享:ASP.NET CORE 项目实战]目录索引 简介 ASP.Net Core 给我们带来的最大的亮点就是跨平台,我在我电脑(win7)上用虚拟机建了个 CentOS7 ,来演示下,我们windows上的项目如何发布项目到Linux上运行.我这里有个在windows上搭建过的程序,我们主要演示如何在linux上运行,所以大家不要纠结于这些,大家可以新建一个web项目尝试一下. 安装.NET Core SDK for CentOS

在Mac上运行ASP.NET 5

原文:http://stephenwalther.com/archive/2015/02/03/asp-net-5-and-angularjs-part-7-running-on-a-mac 这篇文章中, 我会把之前的ASP.NET 5 项目在我的Mac上运行起来. 安装 Mono 首先你得安装Mono. Mono项目独立于Microsoft. Mono是一个.NET运行在Mac OSX和Linux上的开源实现. http://www.mono-project.com/download/ 安装M

如何在Mac上的NTFS格式化驱动器 - 三个简单的步骤

在运行macOS或OS X的Mac和运行Windows的PC之间共享数据可能并不那么简单.默认情况下,Mac只能从Windows格式的外部硬盘读取文件,而不能写入文件.这可以防止您使用Mac保存,编辑,复制或删除驱动器上存储的任何内容.这背后的原因是什么?Mac(HFS +)使用的文件系统与Windows(NTFS)中使用的文件系统不同. 如何在Mac上读取NTFS文件 有一个真正简单的解决方案,但是:您的Mac只需要一个驱动程序.适用于Mac的Tuxera NTFS是一个完整的读写NTFS驱动

Jira - 如何在Mac上安装并配置Jira

Jira 是常用的项目管理工具,现在介绍一下如何在Mac 上安装并配置Jira 首先, 安装并配置JAVA开发环境. (如Java version "1.8.0_211") JAVA安装与配置: JMeter 性能测试 - Mac系统下如何配置JAVA开发环境 其次,安装并配置MySQL.如Server Version: 5.7.25 MySQL Community Server (GPL) 在https://dev.mysql.com/downloads/mysql/5.7.html

如何在Mac上播放和查看SWF文件

有时,某些Mac用户可能会遇到必须打开或访问的SWF文件.如果您有需要在Mac上查看,播放或打开的SWF文件,则可以使用各种免费工具来实现. SWF是Adobe Flash文件的文件格式,在使用Web动画,某些类型的Web视频,图形作品,交互以及其他类似Web内容时,您可能会在各种不同情况下遇到SWF文件,通常是与Web相关或设计工作. 本教程将向您展示如何在Mac上轻松查看和播放SWF文件,我们将介绍几种不同的方法,以便您使用最适合自己的方法. 如何使用VLC在Mac上查看和播放SWF文件 V

利用Mac的功能键|如何在Mac上使用F键

Mac键盘的顶部是一组按键,这些按键的特征是F后跟1-12数字.这些键称为Mac功能键,使您可以通过按几个键来更改某些设置并快速访问Mac功能. 如果您是Mac的所有者,是时候学习这些键各自可以做什么了. 为什么要使用Mac功能键? 如果您曾经使用过键盘快捷键,那么您就会知道它的快捷程度.多亏了快捷键,将您的手移到鼠标或触控板上并导航到您要执行的操作所需的时间得以缩短.功能键的工作方式完全相同,可节省您工作,上网或游戏时的时间. 一些应用程序允许您自定义功能键以适合您的首选项.您也可以通过重新映

如何在Mac上使用Siri

在您的iPhone上,要求Siri执行命令很简单.但是,如果在计算机上工作时附近没有iPhone,会发生什么情况?您也可以在Mac上使用Siri.快速简便,使其成为iMac或MacBook的完美伴侣. 本文中的说明适用于任何运行macOS Sierra或更高版本的Mac . 如何在Mac上启用Siri 首次购买新Mac时,系统会要求您在设置过程中启用Siri.但是,如果您跳过该步骤,则需要先启用Siri,然后才能使用它. 1.在Mac上,单击屏幕左上角的Apple图标. 2.在菜单中,选择系统偏

如何在Mac上安装可视化系统优化工具Sensei 1.0.0

Sensei是适用于任何运行macOS 10.15(Catalina)或更高版本的Mac的应用程序.如何在Mac上安装可视化系统优化工具Sensei 1.0.0,我们设计Sensei来帮助您优化,监控和清洁Mac,以使其性能最大化.Sensei提供了一些与硬件和软件相关的功能,例如超级易于使用的应用程序卸载程序,快速的磁盘清理程序,电池和存储驱动器的运行状况信息等等. Sensei for Mac https://www.macdown.com/mac/6473.html Sensei mac版