<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<title><%= htmlWebpackPlugin.options.title %></title>
<style type="text/css">
/*#app {display: none}*/
.wx-tip{
display: none;
text-align: center;
}
.wx-tip .tip-img {
margin: 30px;
}
.wx-tip .tip-text {
font-weight: 400;
font-size: 20px;
}
</style>
</head>
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<div class="wx-tip">
<img src="https://xxx/info.png" class="tip-img">
<div class="tip-text">请在微信客户端打开链接</div>
</div>
<!-- built files will be auto injected -->
</body>
<script type="text/javascript">
isWeChat()
function isWeChat() {
// 判断浏览器是否含有微信标识
const ua = navigator.userAgent.toLowerCase()
const isWeixin = ua.indexOf('micromessenger') != -1
const app = document.getElementById('app')
const tip = document.getElementsByClassName('wx-tip')[0]
const body = document.getElementsByTagName('body')[0]
if (!isWeixin) {
app.style.display = 'none'
document.body.style.backgroundColor = '#fff'
tip.style.display = 'block'
tip.style.backgroundColor = '#fff'
body.style.backgroundColor = '#fff'
} else {
app.style.display = 'block'
tip.style.display = 'none'
document.body.style.backgroundColor = '#000'
}
}
</script>
</html>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<title><%= htmlWebpackPlugin.options.title %></title>
<style type="text/css">
/*#app {display: none}*/
.wx-tip{
display: none;
text-align: center;
}
.wx-tip .tip-img {
margin: 30px;
}
.wx-tip .tip-text {
font-weight: 400;
font-size: 20px;
}
</style>
</head>
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<div class="wx-tip">
<img src="https://xxx/info.png" class="tip-img">
<div class="tip-text">请在微信客户端打开链接</div>
</div>
<!-- built files will be auto injected -->
</body>
<script type="text/javascript">
isWeChat()
function isWeChat() {
// 判断浏览器是否含有微信标识
const ua = navigator.userAgent.toLowerCase()
const isWeixin = ua.indexOf('micromessenger') != -1
const app = document.getElementById('app')
const tip = document.getElementsByClassName('wx-tip')[0]
const body = document.getElementsByTagName('body')[0]
if (!isWeixin) {
app.style.display = 'none'
document.body.style.backgroundColor = '#fff'
tip.style.display = 'block'
tip.style.backgroundColor = '#fff'
body.style.backgroundColor = '#fff'
} else {
app.style.display = 'block'
tip.style.display = 'none'
document.body.style.backgroundColor = '#000'
}
}
</script>
</html>