1.项目的打包与发布

1.1打包:

npm run build

报错:

原因:原来eslint是一个语法检查工具,但是限制很严格,在我的vue文件里面很多空格都会导致红线(红线可以关闭提示),虽然可以关闭,但是在编译的时候老是会跳出来,所以能关闭是最好的了

解决方法:在build/webpack.base.conf.js文件中,注释或者删除掉:module->rules中有关eslint的规则:

重新执行npm run build

1.2发布1:使用静态服务器工具包

  npm install -g serve      (有一个静态服务器serve)

  serve  dist   (命令:运行dist文件夹)

    访问:http://localhost:5000

1.3发布2:使用动态web服务器(tomcat)

修改配置:webpack.prod.conf.js

  output:{

    //添加下面的配置xxx为项目名称,如:/vue_demo/

    publicPath:'/xxx/'     //打包文件夹的名称

}

  重新打包:

    npm run build

  修改dist文件夹为项目名称:xxx

  将xxx(dist文件夹更名后的文件夹)拷贝到运行tomcat的webapps目录下

然后访问;http://localhost:8080/vue_demo

1.4动态发布页面访问截图

(尚020)Vue打包发布项目的更多相关文章

  1. 浅入深出Vue:发布项目

    项目完成之后,当然不能满足于在我们的开发环境下跑一跑.我们可以打包发布到服务器上,让大家一起来欣赏一下你的作品. 那么 vue 项目如何打包发布呢,新建的项目目录下通常都有一个 README.md 的 ...

  2. 后端 SpringBoot + 前端 vue 打包发布到Tomcat

    近段时间 做了一些前后端的开发 需要在Tomcat里进行发布    把自己整理的分享出来 后端打包 pom.xml 文件 <packaging>war</packaging> ...

  3. VUE打包发布后无法访问js、css资源

    在vue开发中,本地测试以及测试环境中都没有遇到问题,当发布生产,有虚拟路径时,便出现js.css均报错404: 首先在config的index.js文件中,将assetsPublicPath修改为' ...

  4. vue打包发布在spingboot项目中 vue-router路由的处理

    (原) 以下例子springboot后端地址为:localhost:7080/pingandai vue前端地址为:locahost:8080/pingandai/ 1.如果路由模式设置的是histo ...

  5. springBoot打包发布项目------jar包

    这两年微服务很流行,这里简单介绍一下如何将自己使用idea写的微服务打包成一个可执行的jar包,并发布到linux服务器的步骤.因为spring boot有内置的tomcat所以一般使用内置的tomc ...

  6. webpack打包发布项目

    1.打包 :npm run build 2.发布: 1)使用静态服务器工具包 npm install -g serve serve dist 访问:http://www.localhost.5000 ...

  7. vue 打包的项目当背景图路径错误

    当背景图路径错误时: 在build/utils.js中添加或更改这句话:publicPath: '../../',

  8. Vue打包发布到Tomcat后,刷新报错404解决方法

    在应用下面加 WEB-INF 建 web.xml 内容如下 <?xml version="1.0" encoding="ISO-8859-1"?> ...

  9. Spring boot项目的打包发布

    Eclipse打包发布项目 打包项目 首先需要将项目编译的文件删除,执行[Run As]->[Maven clean] 如果这个时候项目报错,在pom.xml文件中添加以下代码过滤掉单元测试 & ...

随机推荐

  1. SQL语句报错:Incorrect string value: '\xE9\x98\xBF\xE6\x96\xAF...'

    很明显是编码的问题.检查了一下$conn->query("set names utf8");已经加在代码里了.那莫非是数据库编码不是utf8? 看了一下 还真不是 于是右键要 ...

  2. 怎么删除json 键值对

    var obj = { 'id': 1, 'name': 2 } delete obj.id delete obj['id'] console.log(obj) //{ 'name': 2 }

  3. Rsync学习之旅中

    rsync配置文件详解 配置文件内容说明 man rsyncd.conf 全局参数 rsyncd.conf参数 参数说明 uid=rsync 运行rsync守护进程的用户. gid=rsync 运行r ...

  4. Spark之RDD容错原理及四大核心要点

    一.Spark RDD容错原理 RDD不同的依赖关系导致Spark对不同的依赖关系有不同的处理方式. 对于宽依赖而言,由于宽依赖实质是指父RDD的一个分区会对应一个子RDD的多个分区,在此情况下出现部 ...

  5. webpack 打包出多个HTML文件,多个js文件,图片文件放置到指定文件夹中

    一.webpack.config.js简单代码 const HtmlWebpackPlugin = require('html-webpack-plugin'); module.exports = { ...

  6. 全栈项目|小书架|微信小程序-点赞功能实现

    微信小程序端的点赞功能其实没什么好介绍的,无非就是调用接口改变点赞状态和点赞数量.需要注意的是取消点赞时的处理,我这里为了减少服务器接口的调用,直接本地存一个变量,修改这里的变量值即可. 由于源码都相 ...

  7. 【已解决】ArcMap的界面如何恢复默认设置

    解决方案:在C盘内搜索“Normal.mxt”,将它删除,然后重启ArcMap,即可.  效果图:

  8. C# vb .net图像合成-合成富文本

    在.net中,如何简单快捷地实现图像合成呢,比如合成文字,合成艺术字,多张图片叠加合成等等?答案是调用SharpImage!专业图像特效滤镜和合成类库.下面开始演示关键代码,您也可以在文末下载全部源码 ...

  9. copy file

    import io,,,,,,, from https://pub.dev/packages/large_file_copy Directory directory = await getApplic ...

  10. 基于SVM的道路简单分割

    折腾了几天了,这个看似简单的东西,怎么做起来那么费劲啊? 任重而道远,光玩,光去幻想,是什么也做不出来的,要一点一点儿大量时间与精力的投入,才能出结果的. (点击下图,可选择原图观看,清晰的效果) 2 ...