Vue3.0商店后台管理系统项目实战-创建项目
首先在d盘里面新建一个文件夹project,在vscode里面打开 打开终端 进入project文件夹 安装依赖
cnpm i yarn -g
初始化一个项目
vue create shop1:按回车键,选择Manually select features （自定义）
Manually select features 自己去选择需要的功能，提供更多的特性选择。比如如果想要支持 TypeScript，就应该选择这一项。
2:9个功能特性，可以多选
回车后可进行选择，9个功能特性，可以多选： 使用方向键在特性选项之间切换，使用空格键选中当前特性，使用 a 键切换选择所有，使用 i 键翻转选项。
我的选择如下，请根据自己需要进行选择。 选择了4个 Babel、Router 、Vuex、Linter / Formatter
对于每一项的功能，此处做个简单描述：
Babel
TypeScript 支持使用 TypeScript 书写源码。
Progressive Web App (PWA) Support PWA 支持。
Router 支持 vue-router 。
Vuex 支持 vuex 。
CSS Pre-processors 支持 CSS 预处理器。
Linter / Formatter 支持代码风格检查和格式化。
Unit Testing 支持单元测试。
E2E Testing 支持 E2E 测试。
3：选择3.0版本
4：是否选择history模式，根据自己需要选择。
5：是否选择预语言，根据自己需要选择。
是否ESlint输出，根据自己需要选择。
6：是否保存时或者提交时是进行ESlint校验，根据自己需要选择。
7：你喜欢把配置Babel, ESLint等放在哪里?
选择把配置文件放在外面，选择 In dedicated config files
8：要不要把当前的这一系列选项配置保存起来，方便下一次创建项目时复用。
一切选择完成，开始初始化项目 这里需要等待几分钟的时间
项目创建完成 进入项目并且运行项目
$ cd shop
$ npm run serve或者 yarn serve最后在浏览器打开
这里可以看见项目的 文件和目录结构
node_modules 存放所有依赖
public favicon.ico 浏览器左上角显示的图标
index.html 项目最终上线的代码
src文件夹 assets文件夹：存放静态资源，包括图标、图片等
components文件夹：存放一般组件
router文件夹：配置路由
store文件夹：配置状态管理
views文件夹：存放路由组件
App.vue：根组件
main.js：项目组入口js文件，引入第三方的库和插件
.browserslistrc 管理浏览器版本的
.gitignore 上传git中忽略的文件
bable.config.js 配置bable的，转移js语法
package-lock.json 所有包的具体信息
package.json 包管理文件
README.md 项目介绍
本文参与 腾讯云自媒体分享计划，分享自作者个人站点/博客。
原始发表：2022-10-11，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
目录