【Vue】基于nodejs的vue项目打包编译部署
2017-12-06 08:23
591 查看
一·项目编译
1·进入项目目录下的终端执行命令npm run build
正常情况如下图,如遇到错误不会编译成功,且编译后的html文件不能正常渲染。
2·编译完成后进入项目下的dist目录运行生成的index.html文件
打开以后f12出现以下错误(资源文件未找到)
打开项目中的index.js文件修改build
里的assetsPublicPath属性为空即可
重新打开index.html发现项目背景图片未找到
去css文件里找到未找到的文件名,进行搜索login_bg.162737a.png
修改资源文件为相应img png图片的相对路径../img/login_bg.162737a.png
二·项目部署
1·项目使用 Apache http server作为启动容器2·环境搭建:
1.安装Apache主程序httpd:【yum install httpd】
2·启动/sbin/service httpd start
3·项目目录cd /var/www/html
4·程序目录/etc/httpd
3·默认使用80端口,如需修改其他端口请
修改配置文件 Listen 80 为指定端口
/etc/httpd/conf/httpd.conf
4·把前端页面放置在/var/www/html下,如放在根目录那就是服务器ip:端口进行访问
如在www目录下新建目录如ump
那就是服务器ip:端口+/ump进行访问
5·若无修改Apache http server
配置文件 需要,正常前端程序部署无需重启Apache http server服务。
相关文章推荐
- 【Tomcat】Tomcat如何部署文件夹项目(非打包)(Eclipse编译)
- 基于Jenkins 实现php项目的自动化测试、自动打包和自动部署
- 基于Jenkins 实现php项目的自动化测试、自动打包和自动部署
- 基于Jenkins 实现php项目的自动化测试、自动打包和自动部署
- vue项目打包部署到服务器的方法示例
- ant+ivy完成项目初始化,编译,单元测试,打包,部署
- 基于Jenkins 实现php项目的自动化测试、自动打包和自动部署(-)
- 基于Jenkins 实现php项目的自动化测试、自动打包和自动部署 推荐
- Vue项目webpack打包部署到Tomcat,刷新报404错
- Vue项目webpack打包部署到服务器的实例详解
- Vue项目webpack打包部署到Tomcat
- 使用Ant构建web项目 从编译到测试 生成测试报告 打包 邮件发送 远程下载tomcat 部署运行一条龙服务之ant脚本
- Vue项目build打包部署到Tomcat后,刷新报404错误解决方案
- 使用ant脚本,对java web项目,编译、打包、发布部署到tomcat
- Maven编译打包部署Liferay项目
- 全自动的使用ANT编译,打包EJB项目,并且部署到Websphere服务器上面
- 基于Jenkins 实现php项目的自动化测试、自动打包和自动部署
- 详解Vue项目编译后部署在非网站根目录的解决方案
- Vue项目webpack打包部署到Tomcat刷新报404错误问题的解决方案
- 解决 eclipse 在编译 打包 部署 maven 项目的时候 WEB-INF/lib 为空 没有 jar的问题