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