利用webpack构建vue项目
快速搭建vue项目
一,确认自己有无搭建好node以及npm环境,这些是前提,具体安装方法可参考https://nodejs.org/en/、
二,开始构建项目。
第1步:新建一个文件夹,随意命名。
第2步:通过vue-cli来构建项目,vue-cli是vue的脚手架工具,可通过命令行:
npm install -g vue-cli
来进行安装。vue-cli只用安装一次,以后可以不用再安装。
第3步:在安装完vue-cli之后,找到自己新建的文件夹,并在这里打开命令提示符cmd。可以通过按住shift然后右键项目文件,就会出现在“此处打开命令窗口”,打开即可,也可以
cd 目标文件夹地址
第4步:进入命令提示窗口后输入
vue init webpack vuedemo
开始进行项目初始化安装。会出现以下提示语句,一直回车就好:

第5步:上述命令执行完之后,我们的项目就初始化完成了,然后开始执行下面的命令:
cd vuedemo
npm install
如果npm太久不成功,可以采用cnpm淘宝镜像来进行安装
第6步:开始运行项目
npm run dev
如果出现:

那你就成功构建好了哈!!!
利用webpack构建vue项目的更多相关文章
- webpack构建vue项目(配置篇)
最近公司要求用vue重构项目,还涉及到模块化开发,于是乎,我专门花了几天的时间研究了一下webpack这个目前来看比较热门的模块加载兼打包工具,发现上手并不是很容易,现将总结的一些有关配置的心得分享出 ...
- 提高 webpack 构建 Vue 项目的速度
前言 最近有人给我的 Vue2 后台管理系统解决方案 提了 issue ,说执行 npm run build 构建项目的时候极其慢,然后就引起我的注意了.在项目中,引入了比较多的第三方库,导致项目大, ...
- 用Webpack构建Vue项目
开始之前,需要安装node环境.(安装过程在此就不啰嗦了) 1.创建基本结构 首先我们要创建一个空文件夹(我这里叫todos,你可以随便命名)作为项目的根目录. 创建一个没有任何依赖关系的pack ...
- 如何减少 webpack 构建 vue 项目的编译时间
背景 我司前端项目框架主要是 vue,多个项目聚集在同一个仓库下,共用公共组件.页面.工具函数等.基于以上前提,我们需要对不同的项目分别进行打包,并解决单页应用强制刷新引起的问题,所以没有使用 vue ...
- webpack构建vue项目(再谈配置)
webpack配置起来确实麻烦,这不,之前用刚配好了vue1+的版本,结果在(部分)安卓机上测试,发现存在开启热加载(dev-server)的情况下不能识别vue语法的问题,试了很多方法,都没能很好的 ...
- webpack构建Vue项目引入jQ时发生“'$' is defined but never used”的处理
今天公司需要新建个数据后台,就按照查到的方法构建了Vue框架的项目,引入jQ.bootstrap时,按照在线方法配置,发现 main.js 里的引用jQ一直显示红标,没多想,在按照网上配置完后,npm ...
- vue,一路走来(1)--构建vue项目
2016年12月--2017年5月,接触前端框架vue,一路走来,觉得有必要把遇到的问题记录下来. 那时,vux用的是1.0的vue,然而vue2.0已经出来了,于是我结合了mint-ui一起来做项目 ...
- vue-cli快速构建vue项目模板
vue-cli 是vue.js的脚手架,用于自动生成vue.js模板工程的. 1.使用npm安装vue-cli 需要先装好vue 和 webpack(前提是已经安装了nodejs,否则连npm都用不了 ...
- vue-cli快速构建Vue项目
vue-cli是什么? vue-cli 是vue.js的脚手架,用于自动生成vue.js模板工程的. vue-cli怎么使用? 安装vue-cli之前,需要先装好vue 和 webpack npm i ...
随机推荐
- UNITY VR 视频/图片 开发心得(一)
现在的VR似乎没有之前那么火热了,于是乎我居然开始了VR征程... 说起VR,对于没有接受过相关知识的人来说可能看起来比较高大上,但是VR的原理却没有想象中那么复杂.总的来说,VR之所以能够产生立体感 ...
- ionicangular 成长日记
//首先配置文件ionic.bundle.min.jsionic.min.css" //创建一个angular控制器,控制器给body/html都可以angular.module('myap ...
- TOJ4114(活用树状数组)
TOJ指天津大学onlinejudge 题意:给你由N个数组成的数列,算出它们的所有连续和的异或和,比如:数列{1,2},则answer = 1 ^ 2 ^ (1 + 2) = 0. 这道题有几个关键 ...
- Java ee el表达式
以前在开发的时候,偶尔会遇到jsp页面不支持el表达式的情况. 这个的原因是因为El功能被关闭了, 当时的解决办法是关闭忽略.isELIgnored 设设置 但是为什么有时候不用设置也可以了呢.发现原 ...
- Spring Boot 系列(五)web开发-Thymeleaf、FreeMarker模板引擎
前面几篇介绍了返回json数据提供良好的RESTful api,下面我们介绍如何把处理完的数据渲染到页面上. Spring Boot 使用模板引擎 Spring Boot 推荐使用Thymeleaf. ...
- ActiveMQ结合WebScoket应用例子以及介绍
一.ActiveMQ的介绍? 1.JMS基础概念 JMS(java Message Service) 即使java消息服务,它提供标准的产生.发送.接收的接口简化企业应用开发,它支持两种消息通信模型: ...
- 【转载】CANoe 入门 Step by step系列(一)基础应用
来源:http://www.cnblogs.com/dongdonghuihui/archive/2012/09/26/2704611.html CANoe是Vector公司的针对汽车电子行业的总线分 ...
- Spark Streaming笔记——技术点汇总
目录 目录 概况 原理 API DStream WordCount示例 Input DStream Transformation Operation Output Operation 缓存与持久化 C ...
- cloudstack下libvirtd服务无响应问题
在cloudstack4.5.2版本下,偶尔出现libvirtd服务无响应的情况,导致virsh命令无法使用,同时伴随cloudstack master丢失该slave主机连接的情况.最初怀疑是lib ...
- phpMyAdmin安装部署
phpMyAdmin 是一个用PHP编写的软件工具,可以通过web方式控制和操作MySQL数据库.通过phpMyAdmin 可以完全对数据库进行操作,例如建立.复制和删除数据等等.如果使用合适的工具, ...