1、必须安装node环境

2、安装vue-client脚手架,在命令提示符中运行npm install -g vue-cli

3、创建项目

vue init 模板名 项目名

例如:vue init webpack my_vue_app

4、运行项目

在命令提示符中进入项目目录

执行npm install    安装依赖(node和webpack依赖包)

执行npm run dev 启动项目

5、启动项目步骤

6、项目目录结构

6.1、package.json :依赖包、常用命令缩写

6.2、config -> index.js : 端口号配置

6.3、src : main.js工程入口文件(app.vue:主要组件)、代码文件

7、vue调用流程

index.html -> main.js -> app.vue -> hello.vue或者其它组件

vue-client脚手架使用的更多相关文章

  1. 简单vue项目脚手架(vue+webpack2.0+vuex+vue-router)

    github地址 使用技术栈 webpack(^2.6.1) webpack-dev-server(^2.4.5) vue(^2.3.3) vuex(^2.3.1) vue-router(^2.5.3 ...

  2. vue.cli脚手架初次使用图文教程

    vue-cli作用 vue-cli作为vue的脚手架,可以帮助我们在实际开发中自动生成vue.js的模板工程. vue-cli使用 !!前提:需要vue和webpack 安装全局vue-cli npm ...

  3. 从0开始搭建vue+webpack脚手架(四)

    之前1-3部分是webpack最基本的配置, 接下来会把项目结构和配置文件重新设计,可以扩充更多的功能模块. 一.重构webpack的配置项 1. 新建目录build,存放webpack不同的配置文件 ...

  4. 从0开始搭建vue+webpack脚手架(三)

    在从0开始搭建vue+webpack脚手架(二)中已经基本完成了开发环境的配置.当开发完成后,我们需要将完成的项目进行打包,接下来对打包做一些优化: 运行 $ npm run build 可生成dis ...

  5. 从0开始搭建vue+webpack脚手架(二)

    接着从0开始搭建vue+webpack脚手架(一) 三.配置webpack-dev-server 1. webpack-dev-server自带一个node的服务器, 项目在服务端运行的同时可以实现热 ...

  6. Vue 去脚手架

    上回模仿了一个nw,按照原理说,简单. 今天说Vue,脚手架是个好东西,做项目都给你配置好,不过对于我这种只想做一个界面的人来说,有点儿太大了,用不上. 如果说,不用脚手架要面临哪些问题呢. 1. 组 ...

  7. 分享一个vue项目“脚手架”项目的实现步骤

    搭建缘由 源于公司每次新启动一个由多人协同开发的项目都由负责人初始化项目之后,每个人再去从私服pull一下项目才开始开发.但是每次初始化工程都是一步步的造轮子,一个个依赖去安装,新建一个个不同功能的文 ...

  8. 13. Vue CLI脚手架

    一. Vue CLI 介绍 1. 什么是Vue CLI? Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.Vue CLI 致力于将 Vue 生态中的工具基础标准化.它确保了各种构建工 ...

  9. 简单vue项目脚手架

    简单vue项目脚手架 github地址 使用技术栈 webpack(^2.6.1) webpack-dev-server(^2.4.5) vue(^2.3.3) vuex(^2.3.1) vue-ro ...

  10. VUE (vue-cli)脚手架项目说明

    1. 概述 1.1 说明 使用vue-cli快速创建的vue项目目录如下: build  -- webpack相关配置以及服务启动文件,配置多依赖于下边的config文件夹中内容 config -- ...

随机推荐

  1. 前端安全系列之二:如何防止CSRF攻击

    原文:https://my.oschina.net/meituantech/blog/2243958 背景 随着互联网的高速发展,信息安全问题已经成为企业最为关注的焦点之一,而前端又是引发企业安全问题 ...

  2. Linux文件与目录操作

    1:目录操作指令 cd :切换目录 pwd:显示当前目录 mkdir:创建一个新目录 rmdir:删除一个空的目录rmdir -r:删除一个非空目录 . :此层目录 .. :上层目录 -:前一个工作目 ...

  3. JAVA & Android 等待线程池内任务全部完成后退出

    void shutdownAndAwaitTermination(ExecutorService pool) { pool.shutdown(); // Disable new tasks from ...

  4. ubuntu普通账户获取root权限的方法以及su和su -的区别

    打开命令窗口 输入命令:sudo passwd root 然后按照上图中的操作进行即可. su和su -的命令的不同: su命令和su -命令最大的本质区别就是:前者只是切换了root身份,但Shel ...

  5. ArcGIS调整影像颜色输出

    有碰到一些质量很差的遥感影像,颜色需要进行调整(主要是针对看)输出,这里记录一下ArcGIS中的调整输出方式. 1.首先把影像文件拖入ArcMap中,然后右键单击图层列表中的图像,选择属性. 2.选择 ...

  6. Jenkins部署Web项目到远程tomcat(通过jenkins插件)

    之前讲到的是如何构建一个项目,并且将代码进行编译.打包,那么打包完成最后的结果就需要发布到应用服务器,将项目部署成功.在之前的项目中我们采用的shell脚本来部署,下面讲解通过Jenkins部署web ...

  7. Linux的telent服务

    目前,在Win/Linux下telnet都很少用了,只是因为数据在传输的过程,未加密!不过在Linux下还是多用于端口探测,今天就来回顾曾经的telnet 1.介绍 Linux被广泛运用到各种服务器及 ...

  8. 用C读取json文件

    a jconf_t * read_jconf(const char *file) { static jconf_t conf; // 清空数据 memset(&conf, , sizeof(j ...

  9. Git/Github的使用以及与Eclipse的整合

    Git简介       Git是一个免费的.分布式的版本控制工具,或是一个强调了速度快的源代码管理工具.每一个Git的工作目录都是一个完全独立的代码库,并拥有完整的历史记录和版本追踪能力,不依赖于网络 ...

  10. Java进制转换, 数据类型, 运算符

    1:进制转换 转换规则: 先把数据的每一位上的系数乘以对应基数的次幂(低位从零开始),然后相加即可 十进制到其他进制 规则:除基取余,直到商为0,最后将余数反转 十进制到二进制: 除2取余,直到商为0 ...