Vue环境搭建及第一个helloWorld
Vue环境搭建及第一个helloWorld
一、环境搭建
1、node.js环境安装配置 https://www.cnblogs.com/liuqiyun/p/8133904.html 或者 https://www.jianshu.com/p/13f45e24b1de
2、安装vue(命令在命令行输入,快捷键win+r;输入cmd,之后输入下面的命令 )
cnpm install vue -g
3、安装vue命令行工具,即vue-cli脚手架
cnpm install vue-cli -g
二、新项目的创建
1、打开存放新建项目的文件夹(比如在D盘新建个vue文件)
快捷键 win + r;输入cmd,回车;打开你新建的文件夹;例:我在D:盘新建了一个空的vue文件夹,那么在命令行输入
2、输入“vue init webpack-simple 项目名称(使用英文)”。例:
就是vue init webpack-simple + 文件名;
初始化完成后的项目目录结构如下:

在后面的链接里,有详细的目录介绍,我就不再赘述https://blog.csdn.net/weixin_40905960/article/details/80375536
3、安装工程依赖模块
定位到test工程目录,安装工程依赖;依赖安装在test目录下,node_module文件夹会被新建,而且根据package.json的配置下载该项目的modules。
cd test
cnpm install
4、运行项目(node启动的
cnpm run dev


最后出来下面这个界面:

三、创建第一个helloWolrd
可以把不要的删除了,例:

第一个hello World

Vue环境搭建及第一个helloWorld的更多相关文章
- scala 入门Eclipse环境搭建及第一个入门经典程序HelloWorld
scala 入门Eclipse环境搭建及第一个入门经典程序HelloWorld 学习了: http://blog.csdn.net/wangmuming/article/details/3407911 ...
- Cesium入门2 - Cesium环境搭建及第一个示例程序
Cesium入门2 - Cesium环境搭建及第一个示例程序 Cesium中文网:http://cesiumcn.org/ | 国内快速访问:http://cesium.coinidea.com/ 验 ...
- ArcGIS API for JavaScript开发环境搭建及第一个实例demo
原文:ArcGIS API for JavaScript开发环境搭建及第一个实例demo ESRI公司截止到目前已经发布了最新的ArcGIS Server for JavaScript API v3. ...
- Java基础教程1:环境配置及第一个HelloWorld.java
本文主要介绍JDK环境配置.Sublime Text3配置及第一个HelloWorld.Java程序.运行环境为Win10系统,使用JDK1.8版本. 1. JDK下载及环境配置 1.1 JDK下载 ...
- visual2017专业版MFC编程环境搭建及第一个MFC程序的创建
1.MFC介绍及环境搭建 MFC全程为Microsoft Foundation class Library,即微软的基本类库,MFC实际上是一个庞大的文件库,它由指向文件和源文件组成. 首先,打开vi ...
- 使用IDEA写Python之pytest环境搭建及第一个程序编写
一.准备篇 Python环境:3.8.3 开发工具:IDEA,对你没有看错 二.IDEA下安装开发环境 1. python的下载 https://www.python.org/downloads/ P ...
- SpringBoot环境搭建及第一个程序运行(详细!)
spring boot简介 spring boot框架抛弃了繁琐的xml配置过程,采用大量的默认配置简化我们的开发过程. 所以采用Spring boot可以非常容易和快速地创建基于Spring 框架的 ...
- FFmpeg 开发环境搭建及第一个程序 Hello FFmpeg 编写
1. FFmpeg 的安装 ./configure make make install 默认会将 FFmpeg 安装至 /usr/local 目录下(可通过 configure 使用 "-p ...
- vue环境搭建与创建第一个vuejs文件
我们在前端学习中,学会了HTML.CSS.JS之后一般会选择学习一些框架,比如Jquery.AngularJs等.这个系列的博文是针对于学习Vue.js的同学展开的. 1.如何简单地使用Vue.js ...
随机推荐
- ASP.NET开发知识总结
1.统一异常处理 某商城采用的异常处理方式,是全局统一捕捉,统一处理 思路: 一.定义异常过滤器 实现 MyExceptionFilter : FilterAttribute,IExceptio ...
- 2019牛客国庆集训派对day1(A, B E F K)
链接:https://ac.nowcoder.com/acm/contest/1099#question A:可知符合条件的图中间肯定存在一个由1构成的矩形,找到由1构成矩形的边界,判断出现的1的数量 ...
- /usr/bin/python^M: bad interpreter: No such file or dir解决办法
Linux直接./xx.py执行python脚本时报错 修改脚本文件编码 $vi xx.py $set ff=unix $:wq
- jumpserver4.0centos7安装步骤
一步一步安装(CentOS) 测试推荐环境 CPU: 64位双核处理器 内存: 4G DDR3 数据库:mysql 版本大于等于 5.6 mariadb 版本大于等于 5.5.6 环境 系统: Cen ...
- FTP上传下载文件(面向对象版)
# 服务端 import socketserver import os import json import hashlib import struct class MySocketServer(so ...
- go 学习之gorm
gorm是一个饱受好评的orm框架,此处数据库我们以mysql为例 import ( "github.com/jinzhu/gorm" _ "github.com/jin ...
- js 动态绑定解绑事件
function addEvent(obj, type, handle) { if (obj.addEventListener) { obj.addEventListener(type, handle ...
- 波兰语 polish
There are several systems for encoding the Polish alphabet for computers. All letters of the Polish ...
- 第4篇创建harbor私有镜像库
一.部署准备: 1.准备harbor软件包 在部署节点上: 2.挂载一个磁盘,专门存储harbor镜像和文件 3.进入到/etc/docker/harbor/目 ...
- jQuery效果-隐藏与显示 小方块的移除
html <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <ti ...