1. 安装node

node下载地址

2. 安装淘宝 NPM

npm 是node.js 的包管理工具。

镜像命令地址

#命令行: npm install -g cnpm

3. 安装vue

# 全局安装 vue-cli
#命令行: cnpm install -g vue-cli

4. 创建一个基于 "webpack" 模板的新项目

#创建一个项目文件夹,在文件夹下shift + 右键,选择在此处打开cmd
#命令行:vue init webpack

5. 安装依赖

#安装依赖
#命令行:cnpm install
#安装完毕后,在项目路径下多出了依赖包。

6. 运行项目

#运行项目

#命令行:cnpm run dev

运行成功,默认8080 端口。

如果需要修改端口,进入目录下config文件夹,找到index.js文件,修改port。

修改端口号后在cmd中输入ctrl + c停止项目,重启项目后就修改成功了。

基于webpack的Vue.js开发环境快速搭建的更多相关文章

  1. Vue.js 开发环境的搭建

    1. cnpm install vue-cli(安装vue 脚手架) 2. vue init webpack my-project(my-project:自定义,取一个项目的名字,init 初始化一个 ...

  2. windows下vue.js开发环境搭建教程

    这篇文章主要为大家详细介绍了windows下vue.js开发环境搭建教程,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 最近,vue.js越来越火.在这样的大浪潮下,我也开始进入vue的学习行列中 ...

  3. Mac安装vue.js开发环境

    Mac安装vue.js开发环境 DannyHooDanny的专栏订阅 一.vue.js开发环境 二.初始化一个vue.js项目 三.vue.js项目打包部署 本来以为在Mac上搭建vue.js的环境挺 ...

  4. 基于 Laravel、Vue.js开发的全新社交系统----ThinkSNS+

    什么是ThinkSNS+ ThinkSNS(简称TS)始于2008年,一款全平台综合性社交系统,为国内外大中小企业和创业者提供社会化软件研发及技术解决方案,目前最新版本为ThinkSNS+.新的产品名 ...

  5. 搭建Vue.js开发环境(window10)

    我在配置Vue.js环境的时候遇到了很多的问题,希望能把这些解决方法也介绍给大家,希望能帮到大家,共同学习. 如果要转发,请注明原作者和原产地,谢谢! 注释:下面任何命令都是在windows的命令行工 ...

  6. Java Web 开发环境快速搭建

    Java Web 开发环境快速搭建 在因某种原因更换开发设备后,可依据此文快速搭建开发环境,恢复工作环境. Java开发环境: Windows 10 (64-bit) Oralce JDK Eclip ...

  7. vue.js开发环境搭建以及创建一个vue实例

    Vue.js 是一套构建用户界面的渐进式框架.Vue 只关注视图层, 采用自底向上增量开发的设计.Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件. 在使用 vue.js ...

  8. 关于 vue.js 运行环境的搭建(mac)

    由于本人使用的是mac系统,因此在vue.js 的环境搭建上遇到许许多多的坑.感谢 showonne.yubang 技术指导,最终成功解决.下面是个人的搭建过程,权当是做个笔记吧. 由于mac非常人性 ...

  9. windows Android开发环境快速搭建和部署

    windows安装Android的开发环境相对来说比较简单,本文写给第一次想在自己Windows上建立Android开发环境的朋友们,为了确保大家能顺利完成开发环境的搭建,文章写的尽量详细,希望对初级 ...

随机推荐

  1. UML类图中的各种箭头代表的含义(转自:http://www.cnblogs.com/damsoft/archive/2016/10/24/5993602.html)

    1.UML简介Unified Modeling Language (UML)又称统一建模语言或标准建模语言. 简单说就是以图形方式表现模型,根据不同模型进行分类,在UML 2.0中有13种图,以下是他 ...

  2. VC++ 6.0 C8051F340 MFC programming note

    /************************************************************************************** * VC++ 6.0 C ...

  3. NET Core的代码安全分析工具 - Security Code Scan

    NET Core的代码安全分析工具 - Security Code Scan https://www.cnblogs.com/edisonchou/p/edc_security_code_scan_s ...

  4. [CF321E]Ciel and Gondolas&&[BZOJ5311]贞鱼

    codeforces bzoj description 有\(n\)个人要坐\(k\)辆车.如果第\(i\)个人和第\(j\)个人同坐一辆车,就会产生\(w_{i,j}\)的代价. 求最小化代价.\( ...

  5. ballerina 学习十八 事务编程

    事务在分布式开发,以及微服务开发中是比较重要的 ballerina 支持 本地事务.xa 事务.分布式事务 ,但是具体的服务实现起来需要按照ballerian 的事务模型 infection agre ...

  6. 对ashx请求用Gzip,Deflated压缩

    //GZIP压缩 //查看请求头部 string acceptEncoding = context.Request.Headers["Accept-Encoding"].ToStr ...

  7. 基数排序算法-python实现

    #-*- coding: UTF-8 -*- import numpy as np def RadixSort(a): i = 0 #初始为个位排序 n = 1 #最小的位数置为1(包含0) max ...

  8. 智能家居入门DIY——【五、执行命令】

    前面几篇介绍了ESP8266使用AT命令来连接WIFI实现一系列功能.这一篇介绍一下使用Wemos D1 Wifi来进行开发,当然也可以用常见的8针ESP8266来完成(只是需要按网上的方法将Ardu ...

  9. java对图片进行操作,仅仅是小demo

    package com.cy.thumb; import java.awt.Rectangle; import java.awt.image.BufferedImage; import java.io ...

  10. Log4j(2)--日志等级

    Log4j根据日志信息的重要程度,分OFF.FATAL.ERROR.WARN.INFO.DEBUG.ALL 当然再细分的话 还有 FATAL(严重错误), 但是Log4j官方建议实际实用的话,Log4 ...