Comments (13)
没试过,你加个jade的loader试试?
from html-res-webpack-plugin.
晕 作者你回复真快
from html-res-webpack-plugin.
doctype html
html(lang='zh_CN')
head
meta(charset='utf-8')
meta(name='viewport', content='width=device-width, height=device-height, user-scalable=no, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0')
block css
if mode != 'dev'
style.
!{css}
block title
title #{title}
body
#app
script(type='text/javascript').
window.Rexxar = window.Rexxar || {};
window.Rexxar.Lifecycle = window.Rexxar.Lifecycle || {};
window.Rexxar.Lifecycle.onPageVisible = function() {};
window.Rexxar.Lifecycle.onPageInvisible = function () {};
script(type='text/javascript').
function showErrorMsg(msg, otherNode) {
if (document.getElementById('errorShowing')) return;
var errorNode = document.createElement('div');
errorNode.id = 'errorShowing';
errorNode.style.color = '#494949';
errorNode.style.textAlign = 'center';
errorNode.style.fontSize = '18px';
errorNode.style.margin = '200px 0 0';
var errorMsg = document.createElement('p');
errorMsg.appendChild(document.createTextNode(msg));
errorNode.appendChild(errorMsg);
if (otherNode && otherNode.nodeName) {
errorNode.appendChild(otherNode);
}
document.body.appendChild(errorNode);
}
script(type='text/javascript').
function logSend(code) {
var ua = navigator.userAgent.toLowerCase();
var rexxarInfo = ua.match(/rexxar( |\/)([0-9.]*)/);
var rexxarVersion = rexxarInfo ? rexxarInfo.pop().split('.').slice(0, 3).join('.') : '';
var label = {msg: code};
var httpRequest = new XMLHttpRequest();
httpRequest.onreadystatechange = function () {
if (httpRequest.readyState === XMLHttpRequest.DONE) {
if (httpRequest.status === 200) {
}
}
}
if (/android/i.test(ua) && rexxarVersion >= '1.2.100') {
var url = 'http://rexxar-container/api/log?_rexxar_method=POST&event=rexxar_page_error&label='
+ encodeURIComponent(JSON.stringify(label));
httpRequest.open('GET', url, true);
httpRequest.send();
} else {
httpRequest.open('POST', 'http://rexxar-container/api/log', true);
httpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
httpRequest.send('event=rexxar_page_error&label=' + encodeURIComponent(JSON.stringify(label)));
}
}
script(type='text/javascript').
window.onerror = function (errorMsg) {
var appNode = document.getElementById('app');
if (appNode.childNodes.length <= 0) {
var errorCode = document.createElement('div');
errorCode.style.fontSize = '14px';
errorCode.style.color = '#9b9b9b';
errorCode.style.margin = '12px';
errorCode.appendChild(document.createTextNode('展开详情'));
errorCode.addEventListener('click', function () {
this.innerText = errorMsg;
});
showErrorMsg('糟糕,页面出现了错误 :(', errorCode);
}
logSend(errorMsg);
}
block commonjs
if mode != 'dev'
script(src='#{vendorSrc}')
if mode == 'dev'
script(type='text/javascript').
window.VENDOR_START = true;
window.VENDOR_END = true;
script(type='text/javascript').
if (!window.VENDOR_START) {
logSend('Vendor assets failed to load.');
var reloadBtn = document.createElement('div');
reloadBtn.style.fontSize = '14px';
reloadBtn.style.color = '#494949';
reloadBtn.style.margin = '12px';
reloadBtn.appendChild(document.createTextNode('点击重试'));
reloadBtn.addEventListener('click', function () {
window.location.reload();
});
showErrorMsg("资源加载失败啦 :(", reloadBtn);
} else if (window.VENDOR_START && !window.VENDOR_END) {
logSend('Vendor assets load incomplete.');
var reloadBtn = document.createElement('div');
reloadBtn.style.fontSize = '14px';
reloadBtn.style.color = '#494949';
reloadBtn.style.margin = '12px';
reloadBtn.appendChild(document.createTextNode('点击重试'));
reloadBtn.addEventListener('click', function () {
window.location.reload();
});
showErrorMsg("资源加载失败啦 :(", reloadBtn);
}
block js
if mode == 'dev'
script(src='#{scriptSrc}')
else
script.
!{js}
from html-res-webpack-plugin.
我想控制 js出现的位置
from html-res-webpack-plugin.
我这个是做匹配的,看起来暂时做不到,有什么好建议不?
from html-res-webpack-plugin.
如果兼容 jade 的话 我想再结合:
对于全局共享的 verdor 直接:
<script src="verdor"></script>对于多页面每个页面不同的chunk css、js 资源 提供一个通用占位符 和接口 动态写
对于我这个需求 我感觉我只需在 chunks 中只配置 此页面的 例如 就只用写 chunks = ['cashbox/index']
from html-res-webpack-plugin.
奇怪 就算用的 html 模板 发现没有对内容进行替换
from html-res-webpack-plugin.
from html-res-webpack-plugin.
from html-res-webpack-plugin.
配置了 chunks = ['manifest','vendor', pathname]
from html-res-webpack-plugin.
你是用jade输出么?
from html-res-webpack-plugin.
不是 html
from html-res-webpack-plugin.
compilation.plugin('html-webpack-plugin-before-html-processing', function(htmlPluginData, callback) {
htmlPluginData.html += 'The magic footer';
callback();
});
在HtmlWebpackPlugin插件中 这个 compilation 哪来的啊?
from html-res-webpack-plugin.
Related Issues (20)
- img 路径 md5 问题 HOT 9
- 使用多个html文件 HOT 2
- 依赖没法自动安装 HOT 5
- filename不支持写路径呢,和HTML Webpack Plugin行为不一致呢,能加上这个功能吗
- 最新版本报错啊 HOT 3
- htmlContent.replace is not function HOT 1
- 想写个插件在生成js的最前面 插入一段js代码 js代码window.pad = pad pad是传进来的 HOT 8
- Using HtmlResWebpackPlugin meet an Error HOT 2
- 支持一下缓存
- 支持querystring匹配 HOT 1
- 支持链接上不写 /
- 如果favicon不存错,不会产生致命error. HOT 1
- 请问能否支持产出js文件?
- 给webpackConfig的output的chunkFilename增加querystring导致资源没匹配上
- 能否支持自定义inject的位置?
- Add unit testing HOT 2
- add minifying feature HOT 1
- add ico HOT 1
- add hot reload support HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from html-res-webpack-plugin.