专栏首页编程微刊使用webstorm来创建并且运行vue项目详细教程

使用webstorm来创建并且运行vue项目详细教程

准备工作,这些就不一一说明了,如果有不会的,可以去前面的教程里面看一看,找一找。

1:webstorm的安装: 2:node.js的安装 3:安装Git 4:vue-cli

1:初始化一个项目 打开cmd(右键管理员)或者git,进入D盘,输入创建命令,一路回车键

d:
vue init webpack myprojectvue

2:创建完成之后 可以看到d盘默认的出现了项目

3:进入项目,运行项目

 cd myprojectvue
 npm run dev

4:打开浏览器 输入http://localhost:8080/#/ 可以看到,这一步为止,项目已经创建完成。

5:打开编辑器,选择file,选择open,打开d盘的项目文件

项目已经导入,接下来就可以对项目进行编辑和修改了

如何使用webstorm运行项目,调出控制台

1:在Webstorm启动项目可以选择在终端输入命令

npm run dev

Webstorm调用终端可以使用快捷键:Alt+F12,

或者在View菜单手动调用。

2:但是每次都打开命令窗口比较麻烦, 可以在webstorm内进行配置,从webstorm内启动 这样更加的方便,那么怎么样在Webstorm快速启动Vue项目配置?

Webstorm快速启动Vue项目配置

1:点击右上角,添加npm配置。

2:点击加号,选择npm

3:命名并且填写运行命令。

4:可以看到控制台出现运行

5:点击绿色按钮,可以看到启动了端口

6:在弹出的默认的浏览器里面,可以看到项目

原文作者:祈澈姑娘 技术博客:https://www.jianshu.com/u/05f416aefbe1 90后前端妹子,爱编程,爱运营,文艺与代码齐飞,魅力与智慧共存的程序媛一枚。 坚持总结工作中遇到的技术问题,坚持记录工作中所所思所见,对于博客上面有不会的问题,可以加入qq技术交流群聊:473819131。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • vue.js提交按钮时简单的if判断表达式示例

    2:当第二个框实收金额没有填写的时候,会有Toast小弹框提示“请输入有效的实付金额”

    祈澈菇凉
  • 使用Webstorm快速启动Vue项目配置

    说一说关于Webstorm的具体操作的问题,这些对于大多数的人来说是一件很简单的事情,但是对于入门小白来说却能卡一下,不要问我是怎么知道的,因为我也是从只懂电脑...

    祈澈菇凉
  • React+Axios调用api并且渲染在前端界面

    因为这个免费的接口可能过段时间就会挂掉,所以把接口的数据直接复制在这里了,后面就算挂掉了也可以自己做成mock数据哦

    祈澈菇凉
  • 2018年热点分享:比特币到底是什么?

    比特币,Bitcoin, 缩写BTC, 是一种总量恒定2100万的数字货币,和互联网一样具有去中心化,全球化,匿名性等这些特性。向地球另一端转账比特币,就想发送...

    企鹅号小编
  • ZooKeeper学习第八期——ZooKeeper伸缩性

    经过前面的介绍,我想大家都已经知道了在ZooKeeper集群当中有两种角色Leader和Follower。Leader可以接受client 请求,也接收其他Se...

    用户5640963
  • LTE珍藏笔记(上)

    本文为作者独家LTE珍藏笔记,属于纯理论介绍,特别适合突击考试使用,敬请各位客官享用,更多干货敬请关注公众号。

    披头
  • android 如何正确使用 泛型 和 多参数 “偷懒”

    我要实现这样一个标题栏 ? 共 4 个选项,采用布局是一个 TextView 对应一个小三角 ImageView,各个选项没被点击时,字体颜色是 黑色,小三角不...

    林冠宏-指尖下的幽灵
  • Python traceback 获取详细的异常信息

    Woodson
  • 首个光电子神经网络问世,速度快3个数量级,扩展人工智能新疆域

    【新智元导读】 光学计算一直被计算机科学界寄予厚望 。光子具有比电子多得多的带宽,因此可以更快地处理更多的数据。但是光学数据处理系统的优点从未超过制造它们的额外...

    新智元
  • 谷歌挖走苹果芯片工程师 自主移动芯片将要面世

    12月23日消息,据报道,谷歌已聘用苹果公司芯片工程师约翰·布鲁诺(John Bruno),该公司正在致力于设计自己的消费者设备芯片组。 ? 据报道称,布鲁诺自...

    企鹅号小编

扫码关注云+社区

领取腾讯云代金券

玩转腾讯云 有奖征文活动