使用webstorm 搭建 vue 开发环境
一.首先安装 node.js
安装成功后在cmd里面使用:node -v 命令查看安装是否成功 下载链接:
链接:https://pan.baidu.com/s/1CL9J4Ryp3sL0zPYKJyS-3A
提取码:d8gl

安装国内的npm镜像源:npm install -g cnpm --registry=https://registry.npm.taobao.org
安装完成后使用:npm -v 或者cnpm -v (推荐使用cnpm 这样更快)

安装vue脚手架:vue-cli
npm install -g @vue/cli
cnpm install -g @vue/cli
Vue 提供了一个官方的 CLI,为单页面应用 (SPA) 快速搭建繁杂的脚手架。它为现代前端工作流提供了 batteries-included 的构建设置。
只需要几分钟的时间就可以运行起来并带有热重载、保存时 lint 校验,以及生产环境可用的构建版本
二、在cmd里面创建vue工程
使用:vue create +文件名 在cmd 创建vue 工程
注意:如果想在创建在某一个文件夹里面只需要切换到对应的目录下即可
出现以下画面就是安装成功:

三、使用webstorm打开创建好的工程
第一步:点击file下的open

选择创建好的vue工程,点击ok即可

点击这里,如果是第一次创建会显示addxx

点击 + 号,选择npm ,Name:名字随便起个,Scripts:这里的参数一定要填写serve,不能随便填写。然后点击ok

点击run 按钮,进行运行vue工程

出现以下页面,说明运行成功,我们可以使用下面的地址去访问我们创建好的工程了

使用webstorm 搭建 vue 开发环境的更多相关文章
- 【原创】windows下搭建vue开发环境+IIS部署
[原创]win10下搭建vue开发环境 如果要转发,请注明原作者和原产地,谢谢! 特别说明:下面任何命令都是在windows的命令行工具下进行输入,打开命令行工具的快捷方式如下图: 详细的安 ...
- windows下搭建vue开发环境+IIS部署
原创]win10下搭建vue开发环境 https://www.cnblogs.com/ixxonline/p/6007885.html 特别说明:下面任何命令都是在windows的命令行工具下进行输 ...
- 十分钟上手-搭建vue开发环境(新手教程)
想写一些关于vue的文章已经很久了,因为这个框架已经火了很久,在公司里用的框架都比较老旧,但怎么也得跟上前端发展变化的潮流,这不,开始使用vue开发项目了,一遍开发一边踩坑中,今天要记录的是五分钟搭建 ...
- 1.WIN10下搭建vue开发环境
WIN10下搭建vue开发环境 详细的安装步骤如下: 一.安装node.js 说明:安装node.js的windows版本后,会自动安装好node以及包管理工具npm,我们后续的安装将依赖npm工具. ...
- 搭建vue开发环境的步骤,六步完成
搭建vue开发环境的步骤,其实也挺简单的,之前这环境的配置也困扰着我一:在搭建vue的开发环境之前,一定一定要先下载node.js,vue的运行是要依赖于node的npm的管理工具来实现,下载地址:h ...
- 初探webpack之从零搭建Vue开发环境
初探webpack之搭建Vue开发环境 平时我们可以用vue-cli很方便地搭建Vue的开发环境,vue-cli确实是个好东西,让我们不需要关心webpack等一些繁杂的配置,然后直接开始写业务代码, ...
- 基于 Webpack 4 搭建 Vue 开发环境
自从工作之后,就已经很久没有写过博客了.时间被分割得比较碎,积累了一段时间的学习成果,才写下了这篇博客. 之前有写过 Webpack4 的文章,但是都比较偏入门,唯一的一篇实战篇 -- 基于Webpa ...
- 搭建Vue开发环境
1.安装Node.js 安装包下载地址: https://nodejs.org/en/ 安装时可以选择是否自动安装必要的工具,如Chocolatey.Python2,这里我选择了自动安装 Node.j ...
- 搭建vue开发环境的步骤
相信很多人在刚开始学习vue这个框架的时候,在最开始搭建开发环境的时候,都会遇到一些大大小小的坑,我之前在学习angular的时候搭建过一次,过了一个月后在搭建第二次的时候,竟然有一些混乱,所以今天想 ...
随机推荐
- NetCore项目实战篇03---HTTP Patch 更新数据
一.什么是HTPP Patch HTTP1.0定义了三种请求方法: GET, POST 和 HEAD方法. HTTP1.1新增了五种请求方法:OPTIONS, PUT, DELETE, TRACE 和 ...
- xenomai内核解析之xenomai的组成结构
@ 目录 一.xenomai 3 二.xenomai3 结构 这是第二篇笔记. 一.xenomai 3 从xenomai3开始支持两种方式构建linux实时系统,分别是cobalt 和 mercury ...
- Objective-C对象模型
Objective-C是一门面向对象的编程语言,每一个对象都是一个类的实例.XCode中打开objc.h可以看到如下定义: /// An opaque type that represents an ...
- MODIS系列之NDVI(MOD13Q1)七:时间序列S-G滤波之Python
时间序列S-G滤波之Python 根据上上篇博文(MODIS系列之NDVI(MOD13Q1)五:NDVI处理流程)做出的NDVI.我们求NDVI时间序列图,但该NDVI时序图为地表各土地类型综合的ND ...
- Django 设置admin后台表和App(应用)为中文名
设置表名为中文 1.设置Models.py文件 class Post(models.Model): name = models.CharField() --省略其他字段信息 class Meta: v ...
- C#学习笔记——数据类型
数据类型 sbyte x; //8bit,有符号,表示-128~127 bite x; //8bit,无符号,表示0~255 short x; //16bit,有符号整型 ushort x; //16 ...
- zabbix-agent客户端安装与配置
zabbix-agent客户端安装与配置 下载abbix-agent客户端源码软件包 解压agent源码包,并且切换到解压目录. [root@localhost ~]# tar -zxf zabbix ...
- xml(3)
xml的解析方式:dom解析和sax解析 DOM解析 使用jaxp进行增删改查 1.创建DocumentBuilderFactory工厂 2.通过DocumentBuilderFactory工厂创建D ...
- javascript实现checkbox提交submit请求
javascript实现checkbox提交submit请求 背景:使用django模板中for来形成多个checkbox,需要点击单个checkbox并查询数据触发submit请求到后台,djang ...
- spark优化总结
1.Spark调优背景 目前Zeppelin已经上线一段时间,Spark作为底层SQL执行引擎,需要进行整体性能调优,来提高SQL查询效率.本文主要给出调优的结论,因为涉及参数很多,故没有很细粒度调优 ...