vue项目环境搭建
安装node.js
$ npm install -g vue-cli
$ vue init webpack my-project
?Project name
?Project description
?Author
?Use ESLint to lint your code?(y/n)
?Setup unit test with Karma + Mocha?(y/n)
?Setup e2e tests with Nightwatch?(y/n)
第一行问你项目名称,输入 my-first-vue-project
第二行问你项目描述,输入 this is my vue
第三行问作者的名字,输入 你自己的名字就好
第四、五、六行都直接在后面输入 NO 。
$ cd my-project
$ npm install
$ npm run dev
===element ui=====
npm i element-ui -S
import Vue from 'vue';
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import App from './App.vue';
Vue.use(ElementUI);
new Vue({
el: '#app',
render: h => h(App)
});
===mint ui=========
Vue 1.x
npm install mint-ui@1 -S
Vue 2.0
npm install mint-ui -S
// 引入全部组件
import Vue from 'vue';
import Mint from 'mint-ui';
Vue.use(Mint);
=============================================================
? Target directory exists. Continue? Yes
? Project name my-project-element-ui
? Project description A Vue.js project
? Author yancy777 1021600964@qq.com
? Vue build standalone
? Install vue-router? No
? Use ESLint to lint your code? No
? Set up unit tests No
? Setup e2e tests with Nightwatch? No
? Should we run npm install for you after the project has been created? (recommended) npm
++++++++++++++++++++++++++++++++++++++++++++++++++++
vue-cli 引入axios及跨域使用:https://www.jianshu.com/p/e36956dc78b8;
vue-axios :https://www.npmjs.com/package/vue-axios
Axios 中文说明:https://www.kancloud.cn/yunye/axios/234845
vue2.0如何使用axios
main.js:
import axios from 'axios'
Vue.prototype.$http = axios
其他地方使用的话 如同使用 vue-resource 一样
this.$http.get(URL).then(response => {
// success callback
}, response => {
// error callback
})
1.对于get请求
axios.get('/user', {
params:{
name:"virus"
}
})
2.对于post请求
axios.post('/user',{
name:"virus"
})
3、 一次性并发多个请求
function getUserAccount(){
return axios.get('/user/12345');
}
function getUserPermissions(){
return axios.get('/user/12345/permissions');
}
axios.all([getUserAccount(),getUserPermissions()])
.then(axios.spread(function(acct,perms){
//当这两个请求都完成的时候会触发这个函数,两个参数分别代表返回的结果
}))
4.axios可以通过配置(config)来发送请求
//发送一个POST请求
axios({
method:"POST",
url:'/user/1111',
data:{
name:"virus"
}
});
vue项目环境搭建的更多相关文章
- Vue 项目环境搭建
Vue项目环境搭建 ''' 1) 安装node 官网下载安装包,傻瓜式安装:https://nodejs.org/zh-cn/ 2) 换源安装cnpm >: npm install -g cnp ...
- vue项目环境搭建与组件介绍
Vue项目环境搭建 """ node ~~ python:node是用c++编写用来运行js代码的 npm(cnpm) ~~ pip:npm是一个终端应用商城,可以换国内 ...
- vue项目ide(vue项目环境搭建)
一.先介绍一下我接下来要做的项目 项目:ide可视化工具 技术应用: Vue2.0(js框架):https://cn.vuejs.org/ ElementUi(饿了吗ui框架基于vue的):http: ...
- day66_10_10,vue项目环境搭建
一.下载. 首先去官网查看网址. 下载vue环境之前需要先下载node,使用应用商城npm下载,可以将其下载源改成cnpm: """ node ~~ python:nod ...
- vue项目环境搭建(webpack4从零搭建)--仅个人记录
一.nodejs环境搭建 首先需要下载node.js(推荐直接官网找最新的版本),下载完成后会自带npm包管理工具,打开cmd命令行界面,输入npm -v .node -v检查node.js与npm是 ...
- Vue项目环境搭建(node+webpack)
安装node.js 下载地址:https://nodejs.org/en/download/ node -v //查看node.js版本 项目环境配置: 安装vue-cli:npm install - ...
- vue项目 环境搭建
1.前端安装 安装项目:vue init webpack docvote 进入docvote里:cd docvote 安装脚手架:cnpm i 运行:npm run dev 2.异步加载 const ...
- vue项目环境的搭建
首先要明白Vue是基于node的,在公司要使用vue来开发项目的话肯定是要先安装node的,下面是搭建一个最简单的vue项目环境 一 安装node 这个可以去node的官网下载对应版本 安装好之后 c ...
- vue开发环境搭建及热更新
写这篇博客的目的是让广大的学者在初入Vue项目的时候少走些弯路,虽然现在有很多博客也有差不多的内容,但是博主在里面添加了一些学习时碰到的小问题.在阅读这篇博客之前,我先给大家推荐一篇文章<入门W ...
随机推荐
- Elasticsearch一些常用操作和一些基础概念
1.查看集群健康状态 [root@ELK-chaofeng01 ~]#curl -XGET http://172.16.0.51:9200/_cat/health?v epoch timestamp ...
- 房企大裁员;争议贺建奎;破产阴影下的ofo:4星|《财经》第29期
<财经>2018年第29期 总第546期 旬刊 高水平的财经杂志.本期重要话题有:1:房企大裁员;2:争议贺建奎;3:破产阴影下的ofo; 总体评价4星,非常好. 以下是书中一些内容的摘抄 ...
- 【16】有关python面向对象编程
面向对象编程 一.第一个案例---创建类 #__author:"吉" #date: 2018/10/27 0027 #function: # 设计类: ''' 1 类名:首字母大写 ...
- msyql备份还原
MySQL备份和还原,都是利用mysqldump.mysql和source命令来完成的. 1.Win32下MySQL的备份与还原 1.1 备份 开始菜单 | 运行 | cmd |利用“cd \Prog ...
- 如何正確的使用 Runtime.exec()
或許大部分有寫過Java程式的人都知道java.lang.Runtime這個class有一個method叫做exec(),可以被用來呼叫(調用)外部的程式.然而大部分的人都不知道這個method存在著 ...
- redis php扩展及基本命令
linux 安装php mysql redis memchache 等工具 用 OneinStack 安装步骤 注意 如果有单独数据盘,建议您先挂载数据盘,建议将网站内容.数据库放在数据盘中.如何挂载 ...
- 20145203盖泽双 《网络对抗技术》实践八:Web基础
20145203盖泽双 <网络对抗技术>实践八:Web基础 1.实践目标 (1)编写Web前端--含有表单的HTML代码. (2)编写Web前端--javascipt验证用户名.密码的代码 ...
- openzeppelin-solidity/contracts的代码学习——access
https://github.com/OpenZeppelin/openzeppelin-solidity/tree/master/contracts/access access - Smart co ...
- python 获取当前路径
使用os模块: os.path.realpath(__file__)
- MySQL 基础三 函数(聚合、字符串、时间、条件判断)
1.聚合 其它:GROUP_CONCAT.avg.sum.count.max.min SELECT typeid,GROUP_CONCAT(goodsname) FROM `goods` GROUP ...