Vue项目的部署
通过vue-cli创建的工程,默认已经打好了基础,包含vue-loader webpack。
通常我们开发中,使用npm run dev进行开发,webpack会Hot reload,不用我们手动刷新浏览器,很是方便。
但是真正部署的时候,需要使用npm run build命令。
这一步命令会压缩代码,打指纹等等。
可以看到dist目录下是这样的目录结构
原来的static目录内的文件,会原样不动上传到dist的static目录下。
/index.html
/static
----/img
----/js
-------/app.83992983.js
-------/vendor.dklajdkfjwer.js
------/ 更多
---/更多文件省略
生产环境下,生成的dist目录下的文件,上传到服务器的www目录下面就可以了。
放到apache或者nginx下面都可以,或者node服务器都可以。如果是node,需要使用nginx代理node的端,也就是配置Location啦,不懂得前端同学可以问问后台。
Vue项目的部署的更多相关文章
- vue项目如何部署到Tomcat中
vue项目如何部署到Tomcat中 1,假设你要访问的项目名称为'hms' 2,在Tomcat的webapps下创建hms文件夹, 3,配置config/index.js文件,build: {} 选项 ...
- 【转】vue项目打包部署——nginx代理访问
我又来了,今天部署了下vue项目,使用nginx做了代理,这样可以解决跨域的问题,这里做一个简单讲解. 1.先看vue项目打包(我这里使用的是vscode开发工具) 这里是我的项目结构: 打包之前需要 ...
- vue项目 打包部署上线
1. npm run dev:本地开发的时候做调试用的. 2. npm run build:打包部署上线,生成一个 dist 文件夹. 注意:用 npm run build 时,常遇到因引用路径不对导 ...
- Vue路由器的hash和history两种工作模式 && Vue项目编译部署
1 # 一.Vue路由器的两种工作模式 2 # 1.对于一个uri来说,什么是hash值? 井号及其后面的内容就是hash值. 3 # 2.hash值不会包括含在HTTP请求中,即:hash值不会带给 ...
- Vue项目打包部署到apache服务器
vue项目在开发环境下,让项目运行起来,是通过npm run dev命令,原理是在本地搭建了一个express服务器. 但是在服务器上就不是这样的,必须要通npm run build命令来对整个项目进 ...
- vue项目打包部署elementUI的字体图标丢失问题
自己搭建的Vue项目,没有使用vue-cli,引入elementUI时,使用的是webpack直接打包工具,发现字体图标丢失你 记录一下解决办法: webpack module配置:(build目录下 ...
- vue项目打包 部署nginx服务器 访问远程接口 本地json 跨域问题
本文建立在你已经在windows7上已经配好了nginx的前提下进行!!! 如果没有请移步至:https://www.cnblogs.com/jack1208-rose0203/p/5739765.h ...
- vue项目打包部署到服务器,静态资源文件404
js文件404问题 原因:打包的项目静态资源的路径需要设置为绝对路径.如果是相对路径会出错 解决办法:修改config/index.js文件,将 assetsPublicPath修改为' ...
- vue项目打包部署到nginx 服务器上
假如要实现的效果如下 http://ip/vue =>是进入首页访问的路径是 usr/local/nginx/html/vue http://ip/website =>是进 ...
随机推荐
- HTTP协议分析
一.域名概述 1.域名解析的作用: 主机数量增多时,IP地址不容易记忆,域名方便记忆.域名记忆更加直观. 2.hosts文件 早期通过hosts文件进行域名的解析,Linux系统中hosts文件存放路 ...
- Android 7.0 调取系统相机崩溃解决android.os.FileUriExposedException
一.写在前面 最近由于廖子尧忙于自己公司的事情和OkGo(一款专注于让网络请求更简单的网络框架) ,故让LZ 接替维护ImagePicker(一款支持单.多选.旋转和裁剪的图片选择器),也是处理了诸多 ...
- iOS开发之自定义UITableView的cell
系统默认的UITableViewCell的每行都有横线(分隔符),就算没有数据也是如此,有时候我们想只在有数据的地方有下划线,可以去除下划线,然后在awarkFromNid方法中使用addsubvie ...
- MYSQL数据库-其他
FROM:实验楼 索引: 当表中有大量记录时,若要对表进行查询,没有索引的情况是全表搜索.而如果在表中已建立索引,在索引中找到符合查询条件的索引值,通过索引值就可以快速找到表中的数据. 建立索引: $ ...
- 任务一:零基础HTML编码练习
任务目的 了解HTML的定义.概念.发展简史 掌握常用HTML标签的含义.用法 能够基于设计稿来合理规划HTML文档结构 理解语义化,合理地使用HTML标签来构建页面 任务描述:完成一个HTML页面代 ...
- P2物理引擎中文文档
P2物理引擎中文文档地址:https://github.com/schteppe/p2.js/wiki/Chinese-wiki-%E4%B8%AD%E6%96%87%E7%BB%B4%E5%9F%B ...
- VB中的GDI编程-2 画笔
p{ font-size: 15px; } .alexrootdiv>div{ background: #eeeeee; border: 1px solid #aaa; width: 99%; ...
- VC加载显示bmp图片的函数
void ShowBitmap(HDC hdc,const char *srcpath) { HBITMAP hBitmap = (HBITMAP)::LoadImage(0, srcpath, IM ...
- gcc编译参数之m32 m64
m32指定编译为32位应用程序: make CFLAGS=-m32 m64指定编译为64位应用程序: make CFLAGS=-m64
- 常用SQL_官方文档使用
SQL语句基础理论 SQL是操作和检索关系型数据库的标准语言,标准SQL语句可用于操作关系型数据库. 5大主要类型: ①DQL(Data Query Language,数据查询语言)语句,主要由于se ...