Vue2.0如何发布项目实战


Posted in Javascript onJuly 27, 2017

大家好,这节我们主要讲解项目的发布,其实很简单,没有大家想的那么复杂,具体如下操作。

一、创建VUE项目

首先我们需要创建VUE项目,创建项目的代码如下:

# 全局安装 vue-cli
$ npm install --global vue-cli
# 创建一个基于 webpack 模板的新项目
$ vue init webpack my-project
# 安装依赖,走你
$ cd my-project
$ npm install
$ npm run dev

项目截图如下:

Vue2.0如何发布项目实战
项目截图

二、项目打包

在打包之前需要修改一个地方,那就是config->index.js文件,修改assetsPublicPath: '/'为assetsPublicPath: './',截图如下:

Vue2.0如何发布项目实战
index.js文件

//上面文件改好后,开始打包,执行如下命令:
npm run build

Vue2.0如何发布项目实战打包后的截图

打包后,项目目录下会生成dist文件夹,这就是我们的整体项目。如图所示:

Vue2.0如何发布项目实战
dist文件夹

三、发布

最后一步就简单了,直接把 dist 目录丢到服务器就可以了,是不是很简单。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery入门问答 整理的几个常见的初学者问题
Feb 22 Javascript
浅说js变量
May 25 Javascript
JavaScript获取当前页面上的指定对象示例代码
Feb 28 Javascript
javascript变量声明实例分析
Apr 25 Javascript
JQuery鼠标移到小图显示大图效果的方法
Jun 10 Javascript
js实现大转盘抽奖游戏实例
Jun 24 Javascript
jquery模拟实现鼠标指针停止运动事件
Jan 12 Javascript
Bootstrap中的Panel和Table全面解析
Jun 13 Javascript
jquery属性,遍历,HTML操作方法详解
Sep 17 Javascript
ES6 let和const定义变量与常量的应用实例分析
Jun 27 Javascript
关于layui toolbar和template的结合使用方法
Sep 19 Javascript
JS实现单张或多张图片持续无缝滚动的示例代码
May 10 Javascript
在Vue中如何使用Cookie操作实例
Jul 27 #Javascript
vue 怎么创建组件及组件使用方法
Jul 27 #Javascript
详解Angular-cli生成组件修改css成less或sass的实例
Jul 27 #Javascript
Vue中如何实现轮播图的示例代码
Jul 27 #Javascript
基于构造函数的五种继承方法小结
Jul 27 #Javascript
vue中各组件之间传递数据的方法示例
Jul 27 #Javascript
微信小程序 页面跳转传值实现代码
Jul 27 #Javascript
You might like
在线短消息收发的程序,不用数据库
2006/10/09 PHP
WordPress中查询文章的循环Loop结构及用法分析
2015/12/17 PHP
php实现三级级联下拉框
2016/04/17 PHP
windows7配置Nginx+php+mysql的详细教程
2016/09/04 PHP
Aster vs KG BO3 第二场2.18
2021/03/10 DOTA
javascript Math.random()随机数函数
2009/11/04 Javascript
js 未结束的字符串常量错误解决方法
2010/06/13 Javascript
jquery ajax例子返回值详解
2012/09/11 Javascript
javascript实现跳转菜单的具体方法
2013/07/05 Javascript
Area 区域实现post提交数据的js写法
2014/04/22 Javascript
JS面试题---关于算法台阶的问题
2016/07/26 Javascript
JavaScript模板引擎Template.js使用详解
2016/12/15 Javascript
nodejs判断文件、文件夹是否存在及删除的方法
2017/11/10 NodeJs
Angularjs中date过滤器失效的问题及解决方法
2018/07/06 Javascript
从零开始学习搭建React脚手架项目
2018/08/23 Javascript
electron + vue项目实现打印小票功能及实现代码
2018/11/25 Javascript
在vue项目中使用Jquery-contextmenu插件的步骤讲解
2019/01/27 jQuery
vue中组件的3种使用方式详解
2019/03/23 Javascript
基于Vue实现电商SKU组合算法问题
2019/05/29 Javascript
VUE : vue-cli中去掉路由中的井号#操作
2020/09/04 Javascript
python实现的简单文本类游戏实例
2015/04/28 Python
django框架auth模块用法实例详解
2019/12/10 Python
Centos7下源码安装Python3 及shell 脚本自动安装Python3的教程
2020/03/07 Python
jupyter notebook插入本地图片的实现
2020/04/13 Python
在Mac中配置Python虚拟环境过程解析
2020/06/22 Python
python 安装移动复制第三方库操作
2020/07/13 Python
移动HTML5前端框架—MUI的使用
2017/12/18 HTML / CSS
财务会计毕业生自荐信
2013/11/02 职场文书
审计工作个人的自我评价
2013/12/25 职场文书
祖国在我心中的演讲稿
2014/05/04 职场文书
材料化学专业求职信
2014/07/15 职场文书
幼儿园小班开学寄语
2015/05/27 职场文书
公司劳动纪律管理制度
2015/08/04 职场文书
《孙子兵法》:欲成大事者,需读懂这些致胜策略
2019/08/23 职场文书
分享几个JavaScript运算符的使用技巧
2021/04/24 Javascript
在 SQL 语句中处理 NULL 值的方法
2021/06/07 SQL Server