vue-cli初步使用

1.安装node.js

            控制台node-v

               

                如图所示就表示node.js安装侧完成,

                没安装的同学到https://nodejs.org/en/download/可以点击去官网下载,安装方法也很简单,一直下一步就好

2.全局安装vue-cli

                

                npm install vue-cli --save-dev(这里我使用的是淘宝镜像,不会安装淘宝镜像的同学,可以去我的博客查找方法)

    3.新建项目

                vue init webpack 项目名称 

                

                在这里选择项目名称,项目简介,是否使用路由,是否使用语法检查,是否使用e2e,按照图中所示选择就可以了

                

                如图所示,表示项目新建成功了,这里也很人性化,告诉你接下来要干嘛

                显示cd 项目目录进入项目,然后npm run dev启动项目就可以了

                

### Vue CLIVue 3 使用指南 #### 创建新项目 为了使用 Vue CLI 创建基于 Vue 3 的项目,需先确认已安装最新版的 `@vue/cli`。通过命令行工具输入 `vue --version` 或者 `vue -V` 来验证当前环境中是否存在可用的 Vue CLI 版本[^3]。 一旦确保了环境准备就绪,则可以通过如下指令来初始化一个新的 Vue 3 应用程序: ```bash vue create my-vue3-app ``` 在此过程中会询问关于项目的配置选项,建议选择默认预设或是手动挑选特性时指定采用 Vue 3 作为框架版本。 #### 安装依赖库 对于希望集成 Element Plus UI 组件库的情况,在成功建立好基础结构之后,可以继续添加必要的包支持。这通常涉及到运行 npm 命令以获取额外资源,例如: ```bash npm install element-plus ``` 此操作将会把 Element Plus 添加到项目当中,并允许开发者立即开始构建具有现代外观的应用界面[^2]。 #### 配置开发服务器 当一切设置完毕后,进入刚刚创建好的目录并启动本地服务来进行初步测试: ```bash cd my-vue3-app npm run serve ``` 上述命令会在后台开启一个热重载功能的服务实例,使得任何更改都能即时反映在浏览器里,极大地提高了迭代效率。 #### 构建生产版本 最后一步则是针对部署场景优化整个应用。为此目的而设计的一条简单命令能够处理所有的编译工作并将最终产物放置于特定文件夹内供分发使用: ```bash npm run build ``` 它不仅压缩了静态资产还进行了其他性能上的改进措施,从而让应用程序可以在真实世界中高效运作。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值