准备工作:配置环境 搭建脚手架 文件项目分类
开发:倒包 配置路由 登陆页面开发 项目开发
今天先配置环境
主要用到的环境和工具有:
node 开发环境
下载node 一般会自动下载npm npm主要用来下载依赖 cnpm是用国内的淘宝镜像下载依赖 下载速度较快
webpack 主要用来打包分类js cs等文件夹
git 用来代码的分支开发和远程管理 由于我是自己尝试写着玩,今天暂时先不下载了
gulp是同来压缩合并代码 一般会在上线的时候使用 或者直接使用webpack
项目开始
一.环境搭建
在网上下载node安装包 根据提示完成安装
1.在桌面新建一个项目文件夹,不可用中文
2.打开文件夹 在项目地址栏中拼写'cmd'按回车键 自动打开黑色命令窗口
3.使用 'node -v'检测node是否安装成功 如果显示一串版本号表示安装成功
4.使用'npm -v'检测npm是否安装成功 如果显示一串版本号表示安装成功
5.输入'npm config set registry https://registry.npm.taobao.org'
回车键即可使用cnpm
6.输入 'cnpm i webpack -g' 回车 安装全局webpack
7.输入 'npm install vue-cli -g' 回车 安装脚手架 安装完成输入'vue -V'(注意这里是大写的“V”)检测是否安装成功
二. 项目构建
1.输入‘ vue init webpack 项目名‘项目名不可用中文 回车
一般都可选y 在下载依赖工具选择的时候选自第三项 自定义选择
然后输入’ cnpm i‘ 下载依赖
默认端口号是8080 确保端口号不被占用
所有下载完成 输入 npm run dev
打开浏览器 输入 localhost:8080 或者配置热加载
如果报错 可自行查看报错原因 一般原因有:
中文文件名 有一些配置版本较低 或者常见的依赖包有问题可删除node moudles文件包 再使用cnpm i重新下载
最后正确的页面为:
---------------------
作者:jiuweiyaoy
来源:CSDN
原文:https://blog.csdn.net/jiuweiyaoy/article/details/79412186
版权声明:本文为博主原创文章,转载请附上博文链接!