使用Vue和Django开发Web系统全流程一(Pycharm创建Vue工程)

使用Pycharm创建Vue工程

1. 下载安装node.js,其官网地址为:https://nodejs.org/en/download/

根据本机的实际情况,选择对应的node.js

安装时务必勾选上npm,默认为勾选状态:

安装完成后使用下面命令检查node和npm是否安装成功:

node -v

npm -v

2. 修改npm的镜像源,将其修改为淘宝镜像源:

npm install -g cnpm --registry=https://registry.npm.taobao.org

3. 使用npm命令安装vue脚手架

cnpm install vue-cli -g //全局安装 vue-cli

4. pycharm安装vue插件

如果pycharm创建的项目中不包含vue,则需要更新下载并安装vue插件

如果pycharm无法下载vue插件,建议重新安装最新版本的pycharm,重新安装时,要根据情况是否卸载原有pycharm

pycharm下载地址:https://www.jetbrains.com/pycharm/download/?fromIDE=#section=windows

下图为安装Vue插件:

安装完vue后,需要重启pycharm。

5. pycharm创建Vue项目

点击Next后,程序会进行Starting Vue Cli,这个过程可能会报出git不是内部或外部命令,也不是可运行的程序的错误。

出现这个则需要安装git,git的下载地址为https://git-scm.com/download/win

选择好对应的git,一路默认安装即可。

注意,在下面的选择项中,务必选择第二项或第三项。

因为选择第二或第三,安装时才会直接将git命令配置到系统的path路径下。

 倘若一切正常,则Pycharm就会出现下面的界面:

这里可以一直下一步。

当然如果需要的话,则每进行一个新的下一步时,我们可以选择性勾选和修改。

这里不再赘述,直接上结果。

使用Pycharm创建vue工程结束后,我们用命令运行它试一下:

执行npm run dev

生成一个浏览器地址,使用浏览器访问该地址,访问成功

 

  • 4
    点赞
  • 39
    收藏
    觉得还不错? 一键收藏
  • 5
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值