Mac下安装并创建VUE项目并引入element-ui组件
1.安装Node
vue的运行是要依赖于node的npm的管理工具来实现,所以第一步需要安装Node,进入到http://nodejs.cn/download/官网。下载对应mac对应的安装包,安装完成后,进入到命令行,输入node -v,显示node的版本即表示安装成功。
2.安装VUE-CLI
VUE-CLI是一相基于Webpack的vue模板项目,我们的项目基于此模板项目开发,所以建第一个项目前需要先安装VUE-CLI,后面再新建项目就不需要了。在macOS命令行执行如下命令:npm install -g vue-cli 即可。安装完成后,进入到命令行,输入vue -v,显示vue的版本即表示安装成功。
3.新建项目
先在macOS上新建一个项目文件夹,在mac命令行上进入(cd ...)到此目录,执行如下命令:vue init webpack object_name,然后根据提示输入项目名等。
目录结构:
|------Project
|------object_name
cd 到 Project目录下,执行 vue init webpack object_name 命令,即可
4.安装项目依赖
继续在mac命令行上执行(项目目录下):npm install 注:现在新的node版本已不需要执行此命令了,如果是用的node老版本则需要执行。
5.运行项目
继续在mac命令行上执行(项目目录下): npm run dev ,运行成功后会弹出一个新的命令行窗口,在窗口中有url地址,如:http://localhost:8080,打开浏览器输入: http://localhost:8080即可打开项目。
6.安装element-UI组件
继续在mac命令行上执行(项目目录下): npm install element-ui -S,运行成功后,查看配置文件package.json,是否有element-u组件的版本号。接下来的引入内容可查看element-UI官网https://element.eleme.cn/#/zh-CN学习。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
· 一个奇形怪状的面试题:Bean中的CHM要不要加volatile?
· 分享4款.NET开源、免费、实用的商城系统
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
· 上周热点回顾(2.24-3.2)