淮南建网站公司,重庆信息网,网页设计图片紧挨着,源代码查看wordpress文件夹背景#xff1a;
想要使用vue搭建一个前端项目#xff0c;写个小网站练练手#xff0c;因为没有前端经验#xff0c;所以从网上找了一个vue得开源模板使用#xff0c;经过一番挑选选中了字节公司花裤衩大佬开源得项目#xff0c;地址如下#xff1a;
开源项目地址
想要使用vue搭建一个前端项目写个小网站练练手因为没有前端经验所以从网上找了一个vue得开源模板使用经过一番挑选选中了字节公司花裤衩大佬开源得项目地址如下
开源项目地址GitHub - PanJiaChen/vue-admin-template: a vue2.0 minimal admin template
node软件地址Index of /download/release/v16.20.0/
因为开源项目五年没更新了使用得是vue2.6版本比较旧但我没有啥特殊要求勉强可用。 操作步骤
1、下载项目 直接下载后解压到本地目录即可比如D:\vue-admin-template
2、环境安装
因为vue项目编译、启动需要用到node、npm、Visual Studio C库所以需要安装一下环境。
到node官网下载软件包因为项目版本问题此处下载node v16版本因为我的电脑是windows系统所以下载msi格式的安装包 下载到电脑后直接双击安装在引导页的最后一页勾选需要安装依赖的工具本勾选可以帮你自动安装npm、Visual Studio C库
3、检查环境
安装完成后重启电脑在命令行页面执行node -v 和 npm -v命令出现版本号就算安装成功 打开应用和功能页面搜索栏输入c出现如下的界面表示安装完成有时不是2015-2022出现2015-2019也可以这个是visual studio的版本号有2013、2015、2017、2019、2022等版本本项目需要最低为2017版本。 4、下载项目依赖包
进入项目目录地址栏中输入cmd进入命令行界面
切换镜像源到国内
npm config set registry https://registry.npm.taobao.org
验证镜像源是否切换成功
npm config get registry
执行依赖包安装
npm install
5、启动项目
执行命令
npm run dev
命令执行完毕会自动在默认浏览器中打开网站登录地址
6、构建项目
执行命令
npm run build:prop
在项目目录中创建/dist文件夹存放打包好的项目文件将文件直接拷贝到web服务器中即可可选择nginx或者tomcat作为服务器。 备注第5、6步的命令为啥要采用dev、build:prop是因为项目中的配置不同的项目是不一致的
