初学Vue.js用vue ui创建项目

文章资讯 2020-07-26 22:24:33

初学Vue.js用vue ui创建项目

这也是我们第一个前后端示例项目的开始
Phil Karlton 曾说“在 CS 领域中,有两件事是非常难的,一个是缓存失效,一个是命名。”
这里随便起个名字吧,这个项目就叫 kola 了,做一个简单的权限管理系统吧
安装@vue/cli
这里还是要安装 @vue/cli, 如果已经安装了请忽略
epimetheus$ npm install -g @vue/cli
安装速度还是比较慢的,大家可以喝杯水
安装完成后可以 vue --version 看下版本号
epimetheus$ vue --version
@vue/cli 4.4.6
创建 Vue 项目
在终端输入命令
$ vue ui
?? Starting GUI...
?? Ready on http://localhost:8000
这里选择创建, 然后创建一个新项目
这里先选择默认,毕竟我不会配呀
创建可能需要等一会
在这里我们可以通过自定义,添加一些其他展示项
这里我们点击插件,添加一下 vue-route, vuex
通过 +添加插件,通过搜索选择一些插件进行安装,这里安装下 element 插件, 选择默认配置直接安装即可
同样的方式安装下 axios 插件
然后我们看看项目能否运行起来
在任务里面我们可以看到 serve、build、lint 和 inspect
点运行,即会运行我们的项目了,成功后点启动项目就能看见我们的项目
如果编译失败了,可以在配置中先将 ESLint configuration 中 保存时检查 先关闭
这样就暂时大功告成了。