mac电脑 安装vue、交互、打包

安装Vue
1、安装brew 
打开终端运行以下命令:
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
安装成功后,查看一下brew的版本信息:
brew -v
2、安装node.js 
在终端中运行以下命令:
brew install nodejs
安装成功后,查看一下node.js的版本信息:
node -v
3、获取nodejs模块安装目录访问权限
 sudo chmod -R 777 /usr/local/lib/node_modules/
4、安装 淘宝镜像 (npm)
npm install -g cnpm --registry= https://registry.npm.taobao.org
5、安装webpack
cnpm install webpack -g
6、安装vue脚手架
npm install vue-cli -g

之后创建项目
1、创建项目: 
cd 目录路径
vue init webpack 工程名字<工程名字不能用中文>
2、安装项目依赖
 一定要从官方仓库安装,npm 服务器在国外所以这一步安装速度会很慢。
npm install  (慎用,会非常慢)
 cnpm install    
3、安装 vue 路由模块vue-router和网络请求模块vue-resource
  cnpm install vue-router vue-resource --save
4、启动项目
  npm run dev

!!!!!!!!关闭项目之后再次启动项目:!!!!!!
cd + 项目
cnpm install
cnpm run dev

已经存在node_modules 的打开项目在项目的
!!!!!!根目录下
npm run dev
关闭用:
ctrl+c


请求数据

http请求配置:在main.js中
import VueResource from 'vue-resource'
Vue.use(VueResource);
安装 axios插件
cnpm install axios
引用://通过import引入在main.js
// http请求
import vueRouter from 'vue-router';
//通过import引入
import axios from 'axios';
然后使用:
Vue.use(vueRouter);
Vue.config.productionTip = false
Vue.prototype.$axios = axios;
调用在 .vue 中:
// ajax请求数据
showData: function() {
this.$axios({
method:"get",
url:"*****************",
data:{
type:'01',
}
}).then((res)=>{
console.log(res.data);
})

打包(别人下面这边博客说的很详细,可以借鉴)

https://www.cnblogs.com/hai-cheng/p/7826701.html


猜你喜欢

转载自blog.csdn.net/yangyanli0309/article/details/80651086