(1)项目打包

终端运行命令 npm run build

打包成功的标志与项目的改变,如下图:

点击index.html,通过浏览器运行,出现以下报错,如图:

那么应该如何修改呢?
    具体步骤如下:

、查看package.js文件的scripts命令
、打开webpack.dev.conf.js文件,找到publicPath: config.dev.assetsPublicPath,按Ctrl点击,跳转到index.js文件
、其中dev是开发环境,build是构建版本,找到build下面的assetsPublicPath: '/',然后修改为assetsPublicPath: './',即“/”前加点。
、终端运行 npm run build 即可。

此时点击index.html,通过浏览器运行便,发现动态绑定的static的图片找不到,故static必须使用绝对路径。将图片路径修改为绝对路径,至此,打包完成。

(2)运行打包项目

需要开启服务运行 
    使用http-server 运行(如没有安装http-server的,使用node 全局安装 http-server 即可,cnpm install http-server -g)

cd dist
http-server

.

vue项目打包步骤及运行打包项目的更多相关文章

  1. 发布项目到 Linux 上运行 Core 项目

    发布项目到 Linux 上运行 Core 项目 目录索引 [无私分享:ASP.NET CORE 项目实战]目录索引 简介 ASP.Net Core 给我们带来的最大的亮点就是跨平台,我在我电脑(win ...

  2. 【无私分享:ASP.NET CORE 项目实战(第十章)】发布项目到 Linux 上运行 Core 项目

    目录索引 [无私分享:ASP.NET CORE 项目实战]目录索引 简介 ASP.Net Core 给我们带来的最大的亮点就是跨平台,我在我电脑(win7)上用虚拟机建了个 CentOS7 ,来演示下 ...

  3. 在Myeclipse中没有部署jeesite项目,但是每次运行其他项目时,还是会加载jeesite项目

    解决办法: 一.在以下路径中找到jeesite文件,并删除 1.Tomcat 7.0\conf\Catalina\localhost 2.Tomcat 7.0\webapps 3.Tomcat 7.0 ...

  4. Springboot项目打包成jar运行2种方式

    最近公司有个项目需要移植到SpringBoot框架上,项目里面又有许多第三方jar包,在linux服务器上最方便的就是用jar的方式来运行SpringBoot项目了,因此我研究了2种打jar包的方式, ...

  5. 使用Apache Tomcat Maven插件部署运行 Web 项目

    什么是Apache Tomcat Maven Plugin? Maven Plugin 是Apache Tomcat 提供的一个Maven插件,它可以在你没有tomcat容器时将任何一个war项目文件 ...

  6. webStrom 运行React-Native项目

    1.点击“Edit Configurations...” 2.点击“+”选择“npm” 3.“Name”随便输入一个名称,“Command”改为“help”,然后在点击“+”号. 4.选择“Run E ...

  7. eclipse git提交项目以及down项目大致步骤

    down git项目步骤: 复制了url之后,import projects项目选中from git ,会出现如下截图,信息会自动填充 填好信息一直Next即可 完成之后,打开“Git Reposit ...

  8. java项目打包成可运行的jar,main方法带参数

    转载 原文地址:http://www.cnblogs.com/neillee/p/6063808.html#commentform 将 java 项目打包成可运行的 jar 包(main 函数带参数) ...

  9. 基于Vue + webpack + Vue-cli 实现分环境打包项目

    需求由来:我公司项目上线发布至服务器分为三个环境分别为测试环境.预发布环境.生产环境:前期做法是项目通过脚步打包时由脚步把域名和后缀名之类的全部替换成要发布的环境所需要的,因为我公司的项目比较大由许许 ...

随机推荐

  1. AutoIT: GUISetFont VS GUICtrlSetFont

    GUISetFont 可以设置默认字体,后面的资源都会用该字体,而 GUICtrlSetFont 可以对特定控件的字体进行设置. ;Combo,setfont, GUICtrlSetFont $fon ...

  2. 【转】Android 6.0 Marsmallow BLE : Connection Parameters

    原文网址:http://stackoverflow.com/questions/34617061/android-6-0-marsmallow-ble-connection-parameters Th ...

  3. Win10 开启 Hyper-V 安装 CentOS 7 minimal

    Win10 开启 Hyper-V 安装 CentOS 7 minimal 日常使用的 PC 环境一般都是 Windows 环境,如果需要偶尔使用 Linux 环境,一般情况下,大家的选择是安装虚拟机 ...

  4. 【转】jenkins上配置robotframeworkride自动化脚本任务

    jenkins上配置robotframeworkride自动化脚本任务 编写好的自动化脚本,集成在jenkins上进行自动运行于监控,这里采用分布式构建,在一台slave上进行任务构建与自动化脚本的运 ...

  5. asp.net mvc 多字段排序

    以下代码可实现多字段排序,通过点击列标题,实现排序. 控制器: public ActionResult Index(string sortOrder) { ViewBag.FirstNameSortP ...

  6. 视图模板中 使用boottstrap 将各表单字段排成一行

    如果需要创建一个表单,它的所有元素是内联的,向左对齐的,标签是并排的,请向 <form> 标签添加 class .form-inline. <form class="for ...

  7. express中cookie的使用和cookie-parser的解读

    https://segmentfault.com/a/1190000004139342?_ea=504710 最近在研究express,学着使用cookie,开始不会用,就百度了一下,没有百度到特别完 ...

  8. 解决axios IE11 Promise对象未定义

    在你的项目中安装polyfill Babel Polyfill 按照官网方法安装并引入即可 http://blog.csdn.net/panyox/article/details/76377248

  9. Vijos P1951 玄武密码 (AC自动机)

    描述 在美丽的玄武湖畔,鸡鸣寺边,鸡笼山前,有一块富饶而秀美的土地,人们唤作进香河.相传一日,一缕紫气从天而至,只一瞬间便消失在了进香河中.老人们说,这是玄武神灵将天书藏匿在此. 很多年后,人们终于在 ...

  10. CF896C Willem, Chtholly and Seniorious(珂朵莉树)

    中文题面 珂朵莉树的板子……这篇文章很不错 据说还有奈芙莲树和瑟尼欧里斯树…… 等联赛考完去学一下(逃 //minamoto #include<bits/stdc++.h> #define ...