React杂篇(1) -- 打包发布注意事项
打包后资源路径
问题:直接打包会出现一下情况:
方式一:
package.json文件下加入homepage
字段
{
"name": "wap-v2",
"version": "0.1.0",
"private": true,
"homepage": "./", //加上此句即可
"dependencies": {...}
}
方式二:
webpack相关 -> config/paths.js
function getServedPath(appPackageJson) {
const publicUrl = getPublicUrl(appPackageJson);
const servedUrl =
envPublicUrl || (publicUrl ? url.parse(publicUrl).pathname : ‘./’); // 配置文件跟路径’/’ 修改这里
return ensureSlash(servedUrl, true);
}
体积优化
项目的体积优化也很重要,开发时的按需加载,模块化分割这里就不多说了。
打包时,会生成一系列的.map文件,占的体积非常大。
webpack相关 -> webpack.config.prod.js
devtool: shouldUseSourceMap ? 'source-map' : false,
//变为
devtool: false,
无报错但空白页
经过上面的配置与修改心想这下总该没事了吧!
然而事实可能不同:
HashRouter与BrowserRouter的异同
项目中控制路由跳转使用的是BrowserRouter。
在开发过程中使用是没有问题的,但是将页面上传至服务器之后,问题就来了:用户访问的资源不存在,页面是空白的,就像上面。
原因:
在browserHistory 模式下,URL 是指向真实 URL 的资源路径,当通过真实 URL 访问网站的时候,由于路径是指向服务器的真实路径,但该路径下并没有相关资源,所以用户访问的资源不存在。
解决
将BrowserRouter
改为 HashRouter
上面文档并不完善,之后有时间再添加或更改。
React杂篇(1) -- 打包发布注意事项的更多相关文章
- react build 后打包发布总结
一,部署在apache web服务器上(wamp | xammp) 1.后台接口需要做跨域设置 (1)在服务端利用Access-Control-Allow-Origin响应头解决. 设置A ...
- word加载项打包发布注意事项总结
最近在做一个word加载项,发布的时候还是有很多坑的现在总结一下:发布工具为Advanced Installer 11.0 网盘地址:http://pan.baidu.com/s/1i4GK3g5 1 ...
- RN在Android打包发布App
参考资料:http://www.jianshu.com/p/b8811669bcb6 RN在Android打包发布App 1-:生成一个签名密钥你可以用keytool命令生成一个私有密钥.在Windo ...
- 快速构建Windows 8风格应用37-常见发布注意事项
原文:快速构建Windows 8风格应用37-常见发布注意事项 引言 通常我们发布Windows Store应用失败后,会返回一些错误需要我们去修改.我之前在给学生做培训的时候发现大部分同学应用被打回 ...
- React项目的打包
1.create-react-app 来自Facebook官方的零配置命令行工具.create-react-app是来自于Facebook出品的零配置命令行工具,能够帮你自动创建基于Webpack+E ...
- React项目的打包与部署到腾讯云
腾讯云送了30天的免费试用,于是有了把react项目部署到上面的想法.项目是默认生成的,只是一个页面,但是这个过程中也遇到了不少麻烦与问题.下面来具体梳理下: create-react-app 来自F ...
- React-Native之打包发布(Android)
React-Native之打包发布(Android) 一,介绍与需求 移动端打包发布到应用市场 二,发布配置 注意:以下所有操作都在win10下进行,React Native版本0.59.5,andr ...
- 服务器(Liunx)打包发布java web工程
Liunx服务器上打包发布web工程(开发工具Idea) 1.首先使用Idea自带的打包功能(点击package打包) 2.然后链接到服务器(我这里用的是Xshell链接工具) 3.将打好的war包传 ...
- Unity3D引用dll打包发布的问题及解决
今年我们开始使用Unity3D开发MMORPG,脚本语言使用C#,这样我们就可以使用以往积累的许多类库.但是,在U3D中使用.NET dll的过程并不是那么顺利,比如我们今天遇到的这种问题. 一.问题 ...
随机推荐
- 第四章 Javac编译原理
4.1 Javac是什么 是一种编译器,将JAVA源代码(.java文件)语言先转化成JVM能够识别的一种语言(.class文件),然后由JVM将JVM语言再转化成当前机器可以识别的机器语言. 4.2 ...
- 根文件系统的构建与分析(四)之瑞士军刀busybox生成系统基本命令
根文件系统的构建与分析(四) 转载请注明 http://blog.csdn.net/jianchi88 Author:Lotte 邮箱:baihaowen08@126.com ls /bin, ...
- 多路复用IO
多路复用IO(IO multiplexing) IO multiplexing这个词可能有点陌生,但是如果我说select/epoll,大概就都能明白了.有些地方也称这种IO方式为事件驱动IO (ev ...
- linux 下安装mysql-5.7.16
1.解压tar -xvf mysql的包 tar -xvf mysql-5.7.16-1.el6.x86_64.rpm-bundle.tar(mysql 官网中即可找到) 2.查看是否需要卸载安装时候 ...
- leetcode884
class Solution { public: void SplitString(const string& s, vector<string>& v, const st ...
- leetcode452
public class Solution { public int FindMinArrowShots(int[,] points) { // multidimensional array cann ...
- Spring总结二:IOC(控制反转)xml方式
1,简介: IoC :Inverse of control 控制反转 ,思想就是在项目中引入一个工厂容器,对项目中接口依赖对象的创建,实现项目中对于依赖对象解耦合. 将程序中对象的创建权以及对象的整个 ...
- maven搭建ssm
前言 本文旨在利用maven搭建ssm环境,而关于maven的具体内容,大家可以去阅读<Maven 实战>.其实园内这方面文章已有不少,那么为什么我还要重复造轮子呢?我只是想记录自己的实践 ...
- instanceof php
instdnceof php5 的一个新成员 功能: 使用这个关键字可以确定一个对象是否是类的实例,是否是累的子类 ,还是实现了某个特定的接口. <?php class A{} class B ...
- solr开发之基本操作
package zr.com.util; import java.io.IOException; import java.util.List; import java.util.Map; import ...