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的更多相关文章

  1. scala 入门Eclipse环境搭建及第一个入门经典程序HelloWorld

    scala 入门Eclipse环境搭建及第一个入门经典程序HelloWorld 学习了: http://blog.csdn.net/wangmuming/article/details/3407911 ...

  2. Cesium入门2 - Cesium环境搭建及第一个示例程序

    Cesium入门2 - Cesium环境搭建及第一个示例程序 Cesium中文网:http://cesiumcn.org/ | 国内快速访问:http://cesium.coinidea.com/ 验 ...

  3. ArcGIS API for JavaScript开发环境搭建及第一个实例demo

    原文:ArcGIS API for JavaScript开发环境搭建及第一个实例demo ESRI公司截止到目前已经发布了最新的ArcGIS Server for JavaScript API v3. ...

  4. Java基础教程1:环境配置及第一个HelloWorld.java

    本文主要介绍JDK环境配置.Sublime Text3配置及第一个HelloWorld.Java程序.运行环境为Win10系统,使用JDK1.8版本. 1. JDK下载及环境配置 1.1 JDK下载 ...

  5. visual2017专业版MFC编程环境搭建及第一个MFC程序的创建

    1.MFC介绍及环境搭建 MFC全程为Microsoft Foundation class Library,即微软的基本类库,MFC实际上是一个庞大的文件库,它由指向文件和源文件组成. 首先,打开vi ...

  6. 使用IDEA写Python之pytest环境搭建及第一个程序编写

    一.准备篇 Python环境:3.8.3 开发工具:IDEA,对你没有看错 二.IDEA下安装开发环境 1. python的下载 https://www.python.org/downloads/ P ...

  7. SpringBoot环境搭建及第一个程序运行(详细!)

    spring boot简介 spring boot框架抛弃了繁琐的xml配置过程,采用大量的默认配置简化我们的开发过程. 所以采用Spring boot可以非常容易和快速地创建基于Spring 框架的 ...

  8. FFmpeg 开发环境搭建及第一个程序 Hello FFmpeg 编写

    1. FFmpeg 的安装 ./configure make make install 默认会将 FFmpeg 安装至 /usr/local 目录下(可通过 configure 使用 "-p ...

  9. vue环境搭建与创建第一个vuejs文件

    我们在前端学习中,学会了HTML.CSS.JS之后一般会选择学习一些框架,比如Jquery.AngularJs等.这个系列的博文是针对于学习Vue.js的同学展开的. 1.如何简单地使用Vue.js ...

随机推荐

  1. mongodb写入策略(WriteConcern)

    写入策略(WriteConcern) mongodb的写入策略有多种方式,写入策略是指当客户端发起写入请求后,数据库什么时候给应答,mongodb有三种处理策略:客户端发出去的时候,服务器收到请求的时 ...

  2. mybatis小技巧

    本节主要讲解mybatis如下五个方面的内容: foreach 批量插入 模糊查询like的写法 #{}和${}的区别 解决实体类中的属性名和表中的字段名不一致问题 由于每次建立工程比较复杂,可以参考 ...

  3. web编程非常实用的在线工具大全---转载

    代码对比/归并: http://www.matools.com/compare 正则表达式: http://www.matools.com/regex js/css压缩: http://www.mat ...

  4. [fw]awk求和

    suse11:~ # cat tmp.lst 4096 4 4096 4 4096 2 4096 4 8192 1 8192 4 8192 4 8192 4 8192 4 8192 4 8192 4 ...

  5. $vim$配置以及$linux$

    vim的配置 1 set nu "设置行标号 2 set tabstop=4 "这一条以及以下三条都把缩进设为4 3 set shiftwidth=4 4 set softtabs ...

  6. java虚拟机规范(se8)——class文件格式(一)

    第四章 class文件格式 本章介绍了java虚拟机的class文件格式.每一个class文件包含一个单独的类或者接口的定义.虽然类和接口不一定都定义在文件中(比如类和接口亦可以通过类加载器直接生成) ...

  7. vue中给请求来的数据List ,添加属性false 后,赋值不上问题解决办法

    data() { return { list:[ // 添加属性fale 后的值 ], // 测试数据 goList:[ { name:'张三', phone:'18621958665' }, { n ...

  8. 如何在嵌套的app中运用vue去写单页面H5

    本文主要介绍移动端.为了避免移动端兼容出现各种奇奇怪怪的bug,所以秉承着能不用复杂的语法就不用,尽量用最基础的语法. 可用惯了各种ES6语法的童鞋们,写原生真是头疼,再加上各种领导催工期,肯定是内心 ...

  9. Git 关于Fast Forward提交的简单说明

    多人协同开发,使用Git经常会看到警告信息包含术语:fast forward, 这是何义? 简单来说就是提交到远程中心仓库的代码必须是按照时间顺序的. 比如A从中心仓库拿到代码后,对文件f进行了修改. ...

  10. 【最新】 ELK之 logstash 同步数据库数据到Elasticsearch

    cd /usr/local 下载logstash 6.4.3版本 wget https://artifacts.elastic.co/downloads/logstash/logstash-6.4.3 ...