Vue项目搭建步骤

一. vue-cli初始化
1. 全局安装 vue-cli
  npm install --global vue-cli
2. 创建一个基于 webpack 模板的新项目
  vue init webpack my-project
3. 安装依赖
  cd my-project
  npm install (换源安装: npm install --registry https://registry.npm.taobao.org )
  npm run dev


二. 安装额外的依赖包
1. 两种依赖包的安装方式
  1.1 项目依赖包
  npm install --save vue
  1.2 开发依赖包
  npm install --save-dev webpack
2. less依赖包
  npm install --save-dev less less-loader
3. 网络请求axios依赖包
  npm install --save axios
4. axios低版本浏览器补丁es6-promise依赖包
  npm install --save es6-promise
5. 路由安装
  npm install --save vue-router
6. 状态管理安装
  npm install --save vuex
7. PC端组件库
  npm install --save element-ui
8. 移动端组件库
  npm install --save mint-ui
9. 上传服务器ssh2
  npm install –save-dev ssh2
10. cookie封装库
  npm install --save js-cookie

三. 其他修改
3.1 开发环境的端口修改
修改/config/index.js


3.2 打包静态文件夹名称修改
修改/config/index.js


3.3 index.html文件自动注入代码压缩配置
修改/build/wepack.prod.config.js


3.4 .vue文件严格模式配置
修改/build/wepack.base.config.js

 

四. 参考链接
vue-cli安装: https://cn.vuejs.org/v2/guide/installation.html
npm换源: http://www.jianshu.com/p/0deb70e6f395
webpack配置: https://webpack.js.org/configuration/
axios文档: https://github.com/mzabriskie/axios
vue-router文档: https://router.vuejs.org/zh-cn/
vuex文档: https://vuex.vuejs.org/zh-cn/
element-ui文档: http://element.eleme.io/#/zh-CN/component/quickstart
mint-ui文档: http://mint-ui.github.io/docs/#!/zh-cn2
ssh2文档: https://github.com/mscdex/ssh2
ssh2方法封装: http://blog.csdn.net/llmys/article/details/52860816?locationNum=2&fps=1
js-cookie文档: https://github.com/js-cookie/js-cookie

 

参考至  http://blog.csdn.net/echo008/article/details/77099058

转载于:https://www.cnblogs.com/yclblog/p/8060013.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/252649.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Python tutor 简介

Python tutor 能够直观显示object 引用关系。 网址是 http://www.pythontutor.com/visualize.html 先分享一下我的一个Python tutor: 点我出现神奇: 1) 编辑code。 2) 运行, 能够看到以下界面。 这个工具是很酷的&…

提高CSS性能

1、选择器 了解CSS的查找匹配原理,让CSS更简洁、高效使用高效率的CSS选择器如何使CSS渲染更高效 总结 不要在ID选择器前使用标签名 一般写法:div#divBox 更好写法:#divBox 解释: 因为ID选择器是唯一的,加上div反而增加…

光学镜头行业发展现状及趋势,智能手机应用领域占比最高

一、光学镜头分类 光学镜头也叫摄像镜头或摄影镜头,简称镜头,其功能就是光学成像。光学镜头是光学成像系统中的必备组件,直接影响到成像质量的好坏,影响算法的实现和效果。从结构来看,光学镜头一般由精密五金、塑胶零…

关于_vmvare workstation装32ubuntu的问题

刚开始启动的时候是黑屏,没有任何反应 1.bios也设置BIOS intel virtual technology 设置了enabled(开启硬件虚拟化:要运行一些操作系统,虚拟化软件和虚拟机,硬件虚拟化就需要启用。大多数情况下,不需要虚拟化技术的操作系统可以正…

window screen (获取屏幕信息)

document.write("屏幕宽度"screen.width);document.write("屏幕高度"screen.height);//(整个电脑的屏幕的高)上面和下面不是有效区的也被包括了 document.write("可用高度"screen.availHeight)//除了上面的任务栏 其他的全…

360°环视(全景影像)系统发展趋势

360环视系统,系统同时采集车辆四周的影像,经过图像处理单元一系列的智能算法处理,最终形成一幅车辆四周的全景俯视图显示在屏幕上,直观地呈现出车辆所处的位置和周边情况。系统大大地拓展了驾驶员对周围和环境的感知能力&#xff…

python简记

Python新手懵懂区: 1.不可变对象是传值,可变对象是传引用 2.不可变对象被真正复制,而可变对象只是复制了一个对它们的引用 3.*args --> 元组型参数传递 **args --> 字典型参数传递 4.浅拷贝:只复制了对对象的引用&#…

需求分析挑战之旅(疯狂的订餐系统)(8)——最后的疯狂

摘要: 说教性质的需求分析理论,各位看了也白看,所以咱们就来一个真实个案——“订餐系统”体验一下。“订餐系统”貌似简单,但陷阱重重,各种需求分析的经典场景将会一一重现,各位做好准备接受这个挑战没有&…

CPU架构:CPU架构详细介绍

1 概述 CPU架构是CPU商给CPU产品定的一个规范,主要目的是为了区分不同类型的CPU。目前市场上的CPU分类主要分有两大阵营,一个是intel、AMD为首的复杂指令集CPU,另一个是以IBM、ARM为首的精简指令集CPU。不同品牌的CPU,其…

【NOIP】关押罪犯

带权并查集&#xff0c;其实这种并查集的核心就是“向量” 1 #include<cstdio>2 #include<iostream>3 #include<algorithm>4 using namespace std;5 int n,m,p[20001],r[20001]; //0表示在同一监狱&#xff0c;1表示在不同监狱 6 struct node{7 int…

数学之路(3)-机器学习(3)-机器学习算法-SVM[7]

SVM是新近出现的强大的数据挖掘工具&#xff0c;它在文本分类、手写文字识别、图像分类、生物序列分析等实际应用中表现出非常好的性能。SVM属于监督学习算法&#xff0c;样本以属性向量的形式提供&#xff0c;所以输入空间是Rn的子集。 图1 如图1所示&#xff0c;SVM的目标是找…

Dalvik指令备忘

跳转指令 if-eq vx, vy, 目标 如果vx vy注2&#xff0c;跳转到目标。if-ne vx,vy, 目标 如果vx ! vy注2&#xff0c;跳转到目标。 if-lt vx,vy, 目标 如果vx < vy注2&#xff0c;跳转到目标。 if-ge vx, vy, 目标 如果vx > vy注2&#xff0c;跳转到目标。 if-gt vx,vy, …

CPU、GPU、FPGA、ASIC等AI芯片特性及对比

1、前言 目前&#xff0c;智能驾驶领域在处理深度学习AI算法方面&#xff0c;主要采用GPU、FPGA 等适合并行计算的通用芯片来实现加速。同时有部分芯片企业开始设计专门用于AI算法的ASIC专用芯片&#xff0c;比如谷歌TPU、地平线BPU等。在智能驾驶产业应用没有大规模兴起和批量…

个人博客03

昨天编写登录界面、注册界面的代码。 今天依旧做这些。 遇到的问题为数据库连接不上。转载于:https://www.cnblogs.com/qilin20/p/8068555.html

人工智能Ai芯片层出不穷,GPU、FPGA、ASIC用于人工智能的优势和劣势对比

人工智能&#xff08;AI&#xff09;主要包括三大要素&#xff0c;分别是数据、算法和算力。其中数据是基础&#xff0c;正是因为在实际应用当中的数据量越来越大&#xff0c;使得传统计算方式和硬件难以满足要求&#xff0c;才催生了AI应用的落地。而算法是连接软件、数据、应…

dom和bom

先看几个两个例题&#xff1a; 星座对应日期&#xff1a; <select id"s1">   <option>a</option>   <option>b</option>   <option>c</option>   <option>d</option>   </select>   <se…

分享自己针对Automation做的两个成熟的框架(QTP 和Selenium)

自己在google code中开源了自己一直以来做的两个自动化的框架&#xff0c;一个是针对QTP的一个是针对Selenium的&#xff0c;显而易见&#xff0c;一个是商业的UI automation工具&#xff0c;一个是开源的自动化工具。 只是代码&#xff0c;可能你直接看的话&#xff0c;有点不…

全景视频拼接关键技术

一、原理介绍 图像拼接(Image Stitching)是一种利用实景图像组成全景空间的技术&#xff0c;它将多幅图像拼接成一幅大尺度图像或360度全景图&#xff0c;图像拼接技术涉及到计算机视觉、计算机图形学、数字图像处理以及一些数学工具等技术。图像拼接其基本步骤主要包括以下几…

Part8 多态性 8.1运算符重载

1运算符重载的规则C 几乎可以重载全部的运算符&#xff0c;而且只能够重载C中已经有的。不能重载的运算符&#xff1a;“.”、“.*”、“::”、“?:”重载之后运算符的优先级和结合性都不会改变。 重载的两种形式&#xff1a;   1 重载为类的非静态成员函数&#xff1b;   …

H面试程序(29):求最大递增数

要求&#xff1a;求最大递增数 如&#xff1a;1231123451 输出12345 #include<stdio.h> #include<assert.h> void find(char *s) {int maxleng 0;int length 1;int pos 0;int i 0;while(s[i] !\0){ if((s[i])<0||(s[i]>9)){assert(0);}if((s[i1]-0) &g…