使用vue-cli脚手架创建vue2项目
1.检查是否安装全局脚手架
安装命令: npm install -g @vue/cli
卸载命令: npm uninstall @vue/cli -g
查看版本: vue -V
2. 创建项目
创建命令: vue create 项目名称
使用vue -cli脚手架创建vue3项目
1. 检查是否安装全局脚手架
2. 创建项目
-- npm create vue@latest
项目解释:
├── .git #git
|__.node_modules #第三方包
|-- dist # 打包后文件夹
├── babel.config.js # babel语法编译
├── package-lock.json
├── public # 静态文件夹,这类资源将会直接被拷贝,而不会经过 webpack 的处理。
│ ├── favicon.ico
│ └── index.html #入口页面
└── src # 源码目录
├── App.vue - 页面
├── assets - 静态目录,这类引用会被 webpack 处理。
│ └── logo.png
├──components 组件
│ └── HelloWorld.vue
└── main.js # 入口文件,加载公共组件
│—— vue.config.js # 配置文件,需自行配置
│—— .gitignore # git忽略上传的文件格式
│—— babel.config.js # babel语法编译
│—— package.json # 项目基本信息 包说明书
│—— .browserslistrc # 指定了项目的目标浏览器的范围
│—— .jsconfig.json # 提供了大量能使我们快速便捷提高代码效率的方法。
|---README.md # 说明
打包上线 在开发完项目之后,就应该打包上线了。vue-cli 也提供了打包的命令,在项目根目录下打开命令窗口,执行命令:npm run build 执行完之后,可以看到在项目根目录下多出了一个 dist 目录,这个就是打包后的页面文件,到时候只需要将这个发给后端,让其部署上线即可。