Hot Module Replacement
This commit is contained in:
parent
835cc3134c
commit
f19caafe6b
|
@ -0,0 +1,34 @@
|
|||
|
||||
const electron = require('electron');
|
||||
const request = require(require('path').join(electron.remote.app.getAppPath(), 'node_modules', 'request'));
|
||||
|
||||
const http_path = electron.ipcRenderer.sendSync('--bd-webpack-server');
|
||||
|
||||
function _eval() {
|
||||
eval(arguments[0]);
|
||||
};
|
||||
|
||||
function loadScript(url) {
|
||||
console.log('[BetterDiscord] loading script', url);
|
||||
|
||||
request({
|
||||
url,
|
||||
strictSSL: false
|
||||
}, function (error, response, data) {
|
||||
if (error) console.error('[BetterDiscord] webpack chunk error', error);
|
||||
|
||||
_eval(data);
|
||||
});
|
||||
}
|
||||
|
||||
loadScript(`${http_path}/betterdiscord.client.js`);
|
||||
|
||||
// Patch document.head.appendChild to load new chunks properly
|
||||
const appendChild = document.head.appendChild;
|
||||
document.head.appendChild = function (script, ...args) {
|
||||
if (script.tagName.toLowerCase() !== 'script' || !script.src.startsWith(`${http_path}/`)) {
|
||||
return appendChild.call(this, script, ...args);
|
||||
}
|
||||
|
||||
loadScript(script.src);
|
||||
};
|
|
@ -139,3 +139,7 @@ if (window.BetterDiscord) {
|
|||
Events.on('autopatcher', () => instance = new BetterDiscord());
|
||||
ReactAutoPatcher.autoPatch().then(() => Events.emit('autopatcher'));
|
||||
}
|
||||
|
||||
if (module.hot) {
|
||||
module.hot.accept('./styles/index.scss', () => DOM.injectStyle(BdCss, 'bdmain'));
|
||||
}
|
||||
|
|
|
@ -22,6 +22,7 @@ const scssLoader = {
|
|||
};
|
||||
|
||||
module.exports = {
|
||||
context: __dirname,
|
||||
entry: './src/index.js',
|
||||
module: {
|
||||
rules: [jsLoader, vueLoader, scssLoader]
|
||||
|
@ -40,16 +41,16 @@ module.exports = {
|
|||
},
|
||||
resolve: {
|
||||
alias: {
|
||||
vue$: path.resolve('..', 'node_modules', 'vue', 'dist', 'vue.esm.js')
|
||||
vue$: path.resolve(__dirname, '..', 'node_modules', 'vue', 'dist', 'vue.esm.js')
|
||||
},
|
||||
modules: [
|
||||
path.resolve('..', 'node_modules'),
|
||||
path.resolve('..', 'common', 'modules'),
|
||||
path.resolve('src', 'modules'),
|
||||
path.resolve('src', 'ui'),
|
||||
path.resolve('src', 'plugins'),
|
||||
path.resolve('src', 'structs'),
|
||||
path.resolve('src', 'builtin')
|
||||
path.resolve(__dirname, '..', 'node_modules'),
|
||||
path.resolve(__dirname, '..', 'common', 'modules'),
|
||||
path.resolve(__dirname, 'src', 'modules'),
|
||||
path.resolve(__dirname, 'src', 'ui'),
|
||||
path.resolve(__dirname, 'src', 'plugins'),
|
||||
path.resolve(__dirname, 'src', 'structs'),
|
||||
path.resolve(__dirname, 'src', 'builtin')
|
||||
]
|
||||
},
|
||||
node: {
|
||||
|
|
|
@ -41,7 +41,9 @@ const TEST_ARGS = () => {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
const TEST_EDITOR = TESTS && true;
|
||||
const TEST_HMR = TESTS && true;
|
||||
|
||||
import process from 'process';
|
||||
import os from 'os';
|
||||
|
@ -221,7 +223,7 @@ export class BetterDiscord {
|
|||
|
||||
this.bindings();
|
||||
this.extraPaths();
|
||||
this.parseClientPackage();
|
||||
if (!TEST_HMR) this.parseClientPackage();
|
||||
this.parseEditorPackage();
|
||||
this.parseCorePackage();
|
||||
|
||||
|
@ -359,8 +361,13 @@ export class BetterDiscord {
|
|||
* @param {Boolean} reload Whether the main window was reloaded
|
||||
*/
|
||||
async injectScripts(reload = false) {
|
||||
console.log(`[BetterDiscord] injecting ${this.config.getPath('client_script')}. Reload: ${reload}`);
|
||||
return this.windowUtils.injectScript(this.config.getPath('client_script'));
|
||||
if (TEST_HMR) {
|
||||
console.log(`[BetterDiscord] injecting webpack ${path.resolve(__dirname, '..', '..', 'client', 'src', 'hmr.js')}. Reload: ${reload}`);
|
||||
return this.windowUtils.injectScript(path.resolve(__dirname, '..', '..', 'client', 'src', 'hmr.js'));
|
||||
} else {
|
||||
console.log(`[BetterDiscord] injecting ${this.config.getPath('client_script')}. Reload: ${reload}`);
|
||||
return this.windowUtils.injectScript(this.config.getPath('client_script'));
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -401,5 +408,66 @@ export class BetterDiscord {
|
|||
}
|
||||
}
|
||||
|
||||
if (TEST_HMR) {
|
||||
const { app, ipcMain } = require('electron');
|
||||
const webpack = require('webpack');
|
||||
const WebpackDevServer = require('webpack-dev-server');
|
||||
const webpackConfig = require('../../client/webpack.config');
|
||||
|
||||
const address = '127.0.0.1';
|
||||
const port = 8091;
|
||||
const http_path = `https://127.0.0.1:${port}`;
|
||||
const ws_path = `wss://127.0.0.1:${port}`;
|
||||
|
||||
const compiler = webpack(Object.assign({}, webpackConfig, {
|
||||
entry: [`webpack-dev-server/client?${http_path}`, 'webpack/hot/dev-server', './src/index.js'],
|
||||
plugins: webpackConfig.plugins.concat([
|
||||
new webpack.HotModuleReplacementPlugin()
|
||||
]),
|
||||
output: Object.assign({}, webpackConfig.output, {
|
||||
publicPath: `${http_path}/`
|
||||
})
|
||||
}));
|
||||
const server = new WebpackDevServer(compiler, Object.assign({}, webpackConfig.devServer, {
|
||||
stats: {
|
||||
colors: true
|
||||
},
|
||||
public: http_path,
|
||||
hot: true,
|
||||
|
||||
// The connection will be upgraded to HTTPS so this is required
|
||||
https: true,
|
||||
|
||||
// By default webpack checks the Origin header, which will fail as the origin will be https://discordapp.com, not https://localhost:8091
|
||||
disableHostCheck: true,
|
||||
headers: {
|
||||
'Access-Control-Allow-Origin': 'https://discordapp.com'
|
||||
}
|
||||
}));
|
||||
|
||||
server.listen(port, address, () => {
|
||||
console.log(`[BetterDiscord] Running webpack dev server at ${http_path}`);
|
||||
});
|
||||
|
||||
CSP['script-src'].push(http_path);
|
||||
CSP['connect-src'].push(http_path);
|
||||
CSP['connect-src'].push(ws_path);
|
||||
|
||||
app.on('certificate-error', (event, webContents, url, error, certificate, callback) => {
|
||||
console.log('[BetterDiscord] certificate error', url, error);
|
||||
if (url.startsWith(`${http_path}/`) || url.startsWith(`${ws_path}/`)) {
|
||||
console.log('[BetterDiscord] continuing anyway');
|
||||
event.preventDefault();
|
||||
callback(true);
|
||||
} else {
|
||||
callback(false);
|
||||
}
|
||||
});
|
||||
|
||||
ipcMain.on('--bd-webpack-server', event => {
|
||||
event.returnValue = http_path;
|
||||
});
|
||||
}
|
||||
|
||||
BetterDiscord.patchBrowserWindow();
|
||||
BetterDiscord.hookSessionRequest();
|
||||
|
|
File diff suppressed because it is too large
Load Diff
|
@ -76,6 +76,7 @@
|
|||
"vue-template-compiler": "^2.6.8",
|
||||
"webpack": "^4.29.6",
|
||||
"webpack-cli": "^3.2.3",
|
||||
"webpack-dev-server": "^3.2.1",
|
||||
"webpack-merge": "^4.2.1"
|
||||
},
|
||||
"scripts": {
|
||||
|
|
Loading…
Reference in New Issue