使用vue搭建应用一入门
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搭建应用一入门的更多相关文章
- vue-cli脚手架搭建项目简单入门一
搭建系统: Windows系统 简单了解Node.js.npm,安装Node.js,下载网址:http://nodejs.cn/download/ 查看node,npm安装成功与否.打开cmd命令行, ...
- Vue.js 十五分钟入门
本文经授权转载,仅用于学习,版权归原作者所有. TypeScript 为 JavaScript 带来静态类型检查,让 JavaScript 编写中大型应用的时候可以应用工具来避免部分错误. Vue 很 ...
- 安卓自动化测试(2)Robotium环境搭建与新手入门教程
Robotium环境搭建与新手入门教程 准备工具:Robotium资料下载 知识准备: java基础知识,如基本的数据结构.语法结构.类.继承等 对Android系统较为熟悉,了解四大组件,会编写简单 ...
- 使用 gulp 搭建前端环境入门篇(转载)
本文转载自: 使用 gulp 搭建前端环境入门篇
- 《vue.js2.0从入门到放弃》学习之路
原文地址: Vue.js2.0从入门到放弃---入门实例(一):http://blog.csdn.net/u013182762/article/details/53021374 Vue.js2.0从入 ...
- Vue (一) --- vue.js的快速入门使用
=-----------------------------------把现在的工作做好,才能幻想将来的事情,专注于眼前的事情,对于尚未发生的事情而陷入无休止的忧虑之中,对事情毫无帮助,反而为自己凭添 ...
- vue搭建前端相关命令
Vue搭建.新建工程并打开浏览器调试的指令: 这四行命令就是我们接下来工作了. 1.npm install –global vue-cli 我们在安装好nodejs后就可以用到“npm”这个前缀指令, ...
- 深入浅出的webpack构建工具--webpack4+vue搭建环境 (十三)
深入浅出的webpack构建工具--webpack4+vue搭建环境 (十三) 从上面一系列的webpack配置的学习,我们现在来使用webpack来搭建vue的开发环境.首先我们来设想下我们的项目的 ...
- webpack4+Vue搭建自己的Vue-cli
前言 最近在看webpack4,深感知识浅薄,这两天也一直在思考cli的配置,借助一些别人的实践,尝试自己搭建vue的项目,这里使用webpack4版本,之前我在网上查找别人的vue项目搭建,但是都是 ...
随机推荐
- 原生js的常用方法总结
=============== 通知: 博主已迁至<掘金>码字,博客园可能以后不再更新,掘金地址:https://juejin.im/post/5a1a6a6551882534af25a8 ...
- vscode React编程配置
2.添加RN开发插件 React Native Tools:微软官方出的ReactNative插件,非常好用Reactjs code snippets:react的代码提示,如componentWil ...
- 简述tcp三次握手
第一次握手:建立连接时,客户端向服务端发送SYN(同步序列编号),其中包含客户端的初始序号seq(序列号)=x,并进入SYN_SENT(请求连接)状态,等待服务器确认. 第二次握手:服务器收到请求后, ...
- 网络编程——select介绍
一.select函数简介 select一般用在socket网络编程中,在网络编程的过程中,经常会遇到许多阻塞的函数,网络编程时使用的recv, recvfrom.connect函数都是阻塞的函数,当函 ...
- 正睿2019省选附加赛 Day10 (这篇其实已经都咕咕了...)
目录 2019.3.13 A.算算算(二项式定理 斯特林数) B.买买买 C.树树树 2019.3.13 比赛链接 A.算算算(二项式定理 斯特林数) 题目链接 \(x^k\)可以用二项式定理展开,需 ...
- 04-树5 Root of AVL Tree (25 分)
An AVL tree is a self-balancing binary search tree. In an AVL tree, the heights of the two child sub ...
- kernel 获取ntoskrnl.exe基址
标题: kernel shellcode之寻找ntoskrnl.exe基址 http://scz.617.cn:8/windows/201704171416.txt 以64-bits为例,这是Eter ...
- lastal
http://last.cbrc.jp/doc/lastal.html This program finds local alignments between query sequences, and ...
- 第08组 Alpha冲刺(2/4)
队名 八组评分了吗 组长博客 小李的博客 作业博客 作业链接 组员1李昕晖(组长) 过去两天完成了哪些任务 文字/口头描述 11月17日了解各个小组的进度与难以攻破的地方,与隔壁第七组组长讨论进度发展 ...
- thymeleaf和freemarker比较
http://freemarker.cn/archives/168.html https://www.zhihu.com/question/64039553/answer/215942472 http ...