1.准备

安装nodejs,配置环境变量

安装了nodejs,也就安装了npm

安装webpack

npm install webpack -g

安装vue脚手架项目初始化工具 vue-cli

npm install vue-cli -g

使用淘宝镜像

npm config set registry https://registry.npm.taobao.org 

安装yarn,facebook发布的nodejs包管理工具

npm i yarn -g -verbose

yarn改为淘宝镜像

yarn config set registry https://registry.npm.taobao.org

2.创建项目

(1)用vue-cli生成项目

vue init webpack robin-ui

(2)安装依赖包

cd robin-ui
yarn install

(3)启动

npm run dev

浏览器打开http://localhost:8080

3.导入到 VS Code

文件——》将文件夹添加到工作区

VS Code 安装扩展插件 vetur

打开 robin-ui

build——webpack构建

config——配置目录

node_modules——依赖

src——代码目录

  main.js核心文件

  App.vue项目入口

static——静态资源

index.html——入口

package.json——项目配置

4.打包命令

npm run build

生成到 dist 目录,部署时将dist直接复制到服务器上

  

使用vue搭建应用一入门的更多相关文章

  1. vue-cli脚手架搭建项目简单入门一

    搭建系统: Windows系统 简单了解Node.js.npm,安装Node.js,下载网址:http://nodejs.cn/download/ 查看node,npm安装成功与否.打开cmd命令行, ...

  2. Vue.js 十五分钟入门

    本文经授权转载,仅用于学习,版权归原作者所有. TypeScript 为 JavaScript 带来静态类型检查,让 JavaScript 编写中大型应用的时候可以应用工具来避免部分错误. Vue 很 ...

  3. 安卓自动化测试(2)Robotium环境搭建与新手入门教程

    Robotium环境搭建与新手入门教程 准备工具:Robotium资料下载 知识准备: java基础知识,如基本的数据结构.语法结构.类.继承等 对Android系统较为熟悉,了解四大组件,会编写简单 ...

  4. 使用 gulp 搭建前端环境入门篇(转载)

    本文转载自: 使用 gulp 搭建前端环境入门篇

  5. 《vue.js2.0从入门到放弃》学习之路

    原文地址: Vue.js2.0从入门到放弃---入门实例(一):http://blog.csdn.net/u013182762/article/details/53021374 Vue.js2.0从入 ...

  6. Vue (一) --- vue.js的快速入门使用

    =-----------------------------------把现在的工作做好,才能幻想将来的事情,专注于眼前的事情,对于尚未发生的事情而陷入无休止的忧虑之中,对事情毫无帮助,反而为自己凭添 ...

  7. vue搭建前端相关命令

    Vue搭建.新建工程并打开浏览器调试的指令: 这四行命令就是我们接下来工作了. 1.npm install –global vue-cli 我们在安装好nodejs后就可以用到“npm”这个前缀指令, ...

  8. 深入浅出的webpack构建工具--webpack4+vue搭建环境 (十三)

    深入浅出的webpack构建工具--webpack4+vue搭建环境 (十三) 从上面一系列的webpack配置的学习,我们现在来使用webpack来搭建vue的开发环境.首先我们来设想下我们的项目的 ...

  9. webpack4+Vue搭建自己的Vue-cli

    前言 最近在看webpack4,深感知识浅薄,这两天也一直在思考cli的配置,借助一些别人的实践,尝试自己搭建vue的项目,这里使用webpack4版本,之前我在网上查找别人的vue项目搭建,但是都是 ...

随机推荐

  1. int pthread_cond_wait(pthread_cond_t *restrict cond, pthread_mutex_t *restric mutex)

    mutex:为了保护条件变量而存在的: cond:为了线程通信而存在的. 整个机制都是为了保护条件变量和线程间通信而存在的. pthread_cond_wait()函数一进入wait状态就会自动rel ...

  2. haproxy 2.0 dataplaneapi 类似的工具haproxyadmin

    haproxyadmin 是一个python 的pip 包,提供了类似dataplaneapi 的功能,使用上也比较简单,同时提供的方法也比较全 使用的技术与dataplaneapi 基本类似,也是一 ...

  3. system.stat[resource,<type>]

    系统信息. 整型或者浮点型 ent - 该分区有权接收的处理器单元数(float) kthr, - 关于内核线程状态的信息: r - 平均可运行内核线程数(float) b - 虚拟内存管理器等待队列 ...

  4. ksh与bash的异同

    (1) 在ksh是,数组的index只能从0到1023,而bash中没有这样的限制. (2) ksh与bash初始化数组的语法不同: 如下所示 icymoon# ksh icymoon# set -A ...

  5. luoguP1118 [USACO06FEB]数字三角形`Backward Digit Su`… 题解

    一上午都在做有关搜索的题目,,, 看到这题之后就直接开始爆搜 结果只有70分, 其余的点硬生生的就是那么WA了. 我的天哪~ 70分代码: #include<iostream> #incl ...

  6. 洛谷 P1825 【[USACO11OPEN]玉米田迷宫Corn Maze】

    P1825 传送门 简单的题意 就是一个有传送门的迷宫问题(我一开始以为是只有1个传送门,然后我就凉了). 大体思路 先把传送门先存起来,然后跑一下\(BFS\). 然后,就做完了. 代码鸭 #inc ...

  7. 第04组Alpha事后诸葛亮

    一.组长博客:地址 二.Postmortem模板 设想和目标 1.我们的软件要解决什么问题?是否定义得很清楚?是否对典型用户和典型场景有清晰的描述? 我们要解决的问题是让大学生可以通过福鱼网站将暂时无 ...

  8. Macbook Pro升级10.15后百度网盘无法登陆,网络连接错误(-1001)

    兴冲冲升级到10.15,结果百度网盘挂了~QQ 由于长期在境外实验室做研究,百度又封锁了境外登陆,所以客户端是唯一跟家里联络的方式,现在它也挂了感觉整个天都塌下来了. 找了一圈,发现一个特别神奇的解锁 ...

  9. TopK问题及优化

    腾讯面试题:有100W个战斗力,取前100名的算法. 经典topK问题,结论是:随机选择算法 + 快排思想,通过随机选择算法,找到第k大的数,再进行一次快排中的partition,就能得到TopK的结 ...

  10. 自定义的操作Cookie的工具类

    可以在SpringMVC等环境中使用的操作Cookie的工具类 package utils; import java.io.UnsupportedEncodingException; import j ...