vue2.0+vue-router2.0+axios+webpack开发webapp项目(一)
来源:互联网 发布:csgo脚本优化 编辑:程序博客网 时间:2024/04/27 15:54
前言:本人第一次将vue运用到实际项目中,将实际开发流程简单描述下(第一次写博客,有问题希望及时提出,讨厌喷子。)
一.安装node环境
首先我们需要安装node环境,这个想必不用多说,可以直接到中文官网http://nodejs.cn/下载安装包。其中,末位为偶数代表稳定版本,可以根据自己电脑情况进行下载。
二.安装vue-cli
安装好了node以后,我们接下来要安装的是vue的脚手架工具vue-cli。运行以下代码进行vue-cli全局安装
npm install -g vue-cli
三.用vue-cli生成项目
全局安装完了vue-cli后,我们接下来可以直接生成项目。运行以下代码生成项目
vue init webpack yourprojectname
(现在生成的版本都是vue2.0的项目如果你想要vue1.0可以运行vue init webpack#1.0 yourprojectname
)
四.运行搭建的项目
当你生成好项目结构后,先进入生成项目目录,我们会发现里面有个package.json文件,大腿们应该都知道,这个文件是安装项目依赖的node_modules的配置,也包括了node环境限制,和浏览器环境限制。
运行npm install进行安装这些依赖
安装完成后运行npm run dev 就可以跑起来vue的demo了。
这里给个小白一个提示(大腿们可忽视),启动服务默认端口是8080,如果8080端口被占用可以修改端口或关闭占用8080端口的程序
阅读全文
0 0
- vue2.0+vue-router2.0+axios+webpack开发webapp项目(一)
- vue2.0+vue-router2.0+axios+webpack开发webapp项目(二)
- vue2.0+vue-router2.0+axios+webpack开发webapp项目(三)
- vue2+vue-router2+webpack实战(一)
- 【Vue2.0】 项目实战案例及Demo,基于vue2.0+vuex+vue-router2+axios实现
- 基于webpack+Vue2.0搭建webapp(vue-cli原理)
- Vue2+VueRouter2+Webpack+Axios 构建项目(一)基础知识概述
- Vue2+VueRouter2+Webpack+Axios 构建项目实战2017重制版(七)初识 *.vue 文件
- Vue2+VueRouter2+Webpack+Axios 构建项目实战2017重制版(七)初识 *.vue 文件
- vue-lazyload基础实例(基于vue2.0和vue-router2.0)
- vue-lazyload基础实例(基于vue2.0和vue-router2.0)
- Vue2+VueRouter2+Webpack+Axios 构建项目实战2017重制版(一)基础知识概述
- Vue2+VueRouter2+Webpack+Axios 构建项目实战2017重制版(一)基础知识概述
- Vue2+VueRouter2+Webpack+Axios 构建项目实战2017重制版(一)基础知识概述
- Vue2+VueRouter2+Webpack+Axios构建项目实战2017重制版(一)基础知识概述
- Vue2+VueRouter2+Webpack+Axios 构建项目实战2017重制版(一)基础知识概述
- Vue2+VueRouter2+Webpack+Axios 构建项目实战2017重制版(一)基础知识概述
- Vue2.0+Vue-router2.0+Vuex2.0搭建搭建环境
- 云计算的三种服务模式(SaaS、PaaS、IaaS)的区别
- 工作后,你悟出什么职场道理?
- PCB布线学习
- 接入 iOS 10.3「应用内评分」新特性
- 需求分析之性能需求
- vue2.0+vue-router2.0+axios+webpack开发webapp项目(一)
- Maven(一)下载与环境变量配置
- C++调用C中的函数
- Java垃圾回收机制与典型的垃圾回收算法
- Python学习笔记——is与==
- makefile:43: *** 遗漏分隔符 。 停止。
- AbstractQueuedSynchronizer(AQS)源码解析下
- 最新iOS发布App Store详细图文教程
- VI中的多行删除与复制