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 相关文章推荐
Js+Dhtml:WEB程序员简易开发工具包(预先体验版)
Nov 07 Javascript
利用JS自动打开页面上链接的实现代码
Sep 25 Javascript
javascript学习笔记(十三) js闭包介绍(转)
Jun 20 Javascript
JavaScript中对循环语句的优化技巧深入探讨
Jun 06 Javascript
jquery实现表单验证并阻止非法提交
Jul 09 Javascript
JS版元素周期表实现方法
Aug 05 Javascript
基于jQuery实现顶部导航栏功能
Dec 27 Javascript
浅谈react+es6+webpack的基础配置
Aug 09 Javascript
简单谈谈vue的过渡动画(推荐)
Oct 11 Javascript
js+html获取系统当前时间
Nov 10 Javascript
iview table render集成switch开关的实例
Mar 14 Javascript
小程序实现展开/收起的效果示例
Sep 22 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
php中数字0和空值的区别分析
2014/06/05 PHP
学习php设计模式 php实现工厂模式(factory)
2015/12/07 PHP
php基于curl实现的股票信息查询类实例
2016/11/11 PHP
Laravel模型间关系设置分表的方法示例
2018/04/21 PHP
微信公众号开发之获取位置信息php代码
2018/06/13 PHP
PHP PDO数据库操作预处理与注意事项
2019/03/16 PHP
用jquery中插件dialog实现弹框效果实例代码
2013/11/15 Javascript
一个不错的字符串转码解码函数(自写)
2014/07/31 Javascript
使用coffeescript编写node.js项目的方法汇总
2015/08/05 Javascript
jQuery简单实现点击文本框复制内容到剪贴板上的方法
2016/08/01 Javascript
AngularJS入门教程之XHR和依赖注入详解
2016/08/18 Javascript
基于bootstrap-datetimepicker.js不支持IE8的快速解决方法
2016/11/07 Javascript
基于ajax与msmq技术的消息推送功能实现代码
2016/12/26 Javascript
webpack的CSS加载器的使用
2018/09/11 Javascript
简单了解JavaScript异步
2019/05/23 Javascript
React中使用Vditor自定义图片详解
2020/12/25 Javascript
Python实现发送email的几种常用方法
2014/08/18 Python
Python3.6正式版新特性预览
2016/12/15 Python
python 数据清洗之数据合并、转换、过滤、排序
2017/02/12 Python
python自动截取需要区域,进行图像识别的方法
2018/05/17 Python
Python实现判断一行代码是否为注释的方法
2018/05/23 Python
浅谈python标准库--functools.partial
2019/03/13 Python
python实现的config文件读写功能示例
2019/09/24 Python
关于Tensorflow 模型持久化详解
2020/02/12 Python
pytorch实现从本地加载 .pth 格式模型
2020/02/14 Python
Python之字典添加元素的几种方法
2020/09/30 Python
python爬虫利用代理池更换IP的方法步骤
2021/02/21 Python
CSS3 background-image颜色渐变的实现代码
2018/09/13 HTML / CSS
柯基袜:Corgi Socks
2017/01/26 全球购物
澳大利亚儿童精品仓库:Goo & Co.
2019/06/20 全球购物
高中毕业自我鉴定
2013/12/16 职场文书
创建文明城市标语
2014/06/16 职场文书
教育系统干部作风整顿心得体会
2014/09/09 职场文书
《我爱祖国》演讲稿1000字
2014/09/26 职场文书
2014年行政执法工作总结
2014/12/11 职场文书
高中优秀作文(范文)
2019/08/15 职场文书