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. Java Excel 导入导出(一)

    本文主要描述通过java实现Excel导入导出 一.读写Excel三种常用方式 1.JXL——Java Excel开放源码项目:读取,创建,更新 2.POI——Apache POI ,提供API给Ja ...

  2. 数据库 = filesystem + transcation + dsl + dslengine

    数据库 = filesystem + transcation + dsl + dslParser

  3. Maven pom文件中dependency scope用法

    在Maven中依赖的域有:compile.provided.runtime.system.test.import 一.compile(默认) 当依赖的scope为compile的时候,那么当前这个依赖 ...

  4. es6 -- rest 参数

    es6 引入了rest参数(形式:...变量名),用于获取函数的多余参数,这样就不需要使用arguments对象了.rest参数搭配的变量是一个数组,该变量将多余的参数放入数组中. function ...

  5. Vuejs发送Ajax请求

    一.概况 ①vuejs中没有内置任何ajax请求方法 ②在vue1.0版本,使用的插件 vue resource 来发送请求,支持promise ③在vue2.0版本,使用社区的一个第三方库 axio ...

  6. select函数及fd_set介绍

    1. select函数 1. 用途 在编程的过程中,经常会遇到许多阻塞的函数,好像read和网络编程时使用的recv, recvfrom函数都是阻塞的函数,当函数不能成功执行的时候,程序就会一直阻塞在 ...

  7. nginx 配置虚拟主机( 基于端口 )

    一.创建网站目录及文件: [root@localhost data]# tree /data /data └── wwwroot ├── www.1.com_8080 │   └── index.ht ...

  8. xsxsxs

    def getdecrype(l): a= length="" ): if(l[a]=="x"): break else: length+=l[a] a+= h ...

  9. 【转】Android原生PDF功能实现

    1.背景 近期,公司希望实现安卓原生端的PDF功能,要求:高效.实用. 经过两天的调研.编码,实现了一个简单Demo,如上图所示.关于安卓原生端的PDF功能实现,技术点还是很多的,为了咱们安卓开发的同 ...

  10. MyBatis(八):Mybatis Java API枚举类型转化的用法

    最近工作中用到了mybatis的Java API方式进行开发,顺便也整理下该功能的用法,接下来会针对基本部分进行学习: 1)Java API处理一对多.多对一的用法: 2)增.删.改.查的用法: 3) ...