vuetify project hello-world

本文介绍了如何使用vue-cli创建Vue项目,配置Vuex和Vue Router,升级Yarn版本解决'ajv'包问题,并成功集成Vuetify。步骤包括安装基础依赖、手动选择特性、添加Vuetify组件和部署本地服务器。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Vuetify hello, world

先安装vue-cli
https://cli.vuejs.org/zh/guide/creating-a-project.html#vue-create

通过vue-cli创建项目

vue create helloworld

项目一般都要用vuexvue-routerpreset选择Manually select features
在这里插入图片描述
我要用VuexRouter
在这里插入图片描述
vue版本选2.x
在这里插入图片描述
是否启用router历史?我选n
在这里插入图片描述
cd helloworld

vue add vueity

再终端里执行yarn serve命令

yarn serve

打开浏览器,输入http://localhost:8080/
在这里插入图片描述
可以看到vuetify界面了。

https://zhaocunwei.blog.youkuaiyun.com/article/details/111134060

yarn remove sass-loader
yarn add sass-loader@8.0.0

Trouble shooting

执行vue add vuetify报错 (2021-10-11)

初始化一个新项目,居然报错。

yarn add v1.22.11
[1/4] 🔍  Resolving packages...
error Couldn't find package "ajv@^6.12.5" required by "schema-utils@^3.0.0" on the "npm" registry.
info Visit https://yarnpkg.com/en/docs/cli/add for documentation about this command.
 ERROR  command failed: yarn add vue-cli-plugin-vuetify -D --tilde

怀疑是Yarn版本太低导致,查了Yarn的官方文档https://yarnpkg.com/getting-started/install,执行以下命令:

yarn set version latest

重新执行vue add vuetify,成功了。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值