手抄报 安全手抄报 手抄报内容 生活知识 生活百科 英语手抄报 清明节手抄报 节约用水手抄报 知识问答

如何搭建vue项目

时间:2026-04-03 15:18:47

1、第一步,为了方便进行代码编写和步骤说明,我们点击打开【html编辑器sublime_text】,详细如下图

如何搭建vue项目

2、第二步,首先我们全局安装vue-cli脚手架,打开命令提示符工具,然后输入命令【npm install vue-cli -g】,按回车键,,想要看安装是否成功,我们可以输入命令【vue list】查看详细如下图

如何搭建vue项目

3、第三步,安装好vue-cli以后,我们选择一个安装vue项目的位置,然后输入命令【vue init webpack vue0624】(vue0624是项目的名称),然后安装步骤安装就可以了,最后选择【Yes,use NPM】,不会的详细看下图,然后就会自动安装了,详细如下图

如何搭建vue项目

4、第四步,慢慢等待 【vue0624文件夹就会创建一个vue项目了】,详细如下图

如何搭建vue项目

5、第五步,安装完以后,我们在当前的命令提示符工具中输入【cd  vue0624】,然后安装依赖包,命令如下【npm install】,详细如下图

如何搭建vue项目

6、第六步,安装好依赖包以后,我们运行命令【npm run dev】,就会把vue的项目跑起来,然后我们在浏览器中输入【http://localhost:8080】,就会看到项目运行起来了,详细如下图

如何搭建vue项目

7、最后总结一下:全局安装vue-cli(npm install vue-cli -g)-安装vue项目(vue init webpack vue0624)-进入项目路径-安装依赖包(npm install)-运行项目(npm run dev),详细如下图

如何搭建vue项目

© 2026 手抄报圈
信息来自网络 所有数据仅供参考
有疑问请联系站长 site.kefu@gmail.com