1
0
Fork 0
mirror of https://github.com/FrankerFaceZ/FrankerFaceZ.git synced 2025-07-29 14:08:31 +00:00

Add transpiling with Babel so Edge will work.

This commit is contained in:
SirStendec 2018-03-14 14:33:03 -04:00
parent 254d297f79
commit 29a4d8175e
5 changed files with 83 additions and 1 deletions

4
.babelrc Normal file
View file

@ -0,0 +1,4 @@
{
"presets": ["env"],
"plugins": ["syntax-dynamic-import", "transform-runtime"]
}

View file

@ -1,3 +1,11 @@
<div class="list-header">4.0.0-beta1.6<span>@b26925b82613bdc459b5</span> <time datetime="2018-03-14">(2018-03-14)</time></div>
<ul class="chat-menu-content menu-side-padding">
<li>Fixed: Minimal Navigation causing the navigation bar to render over theater mode.</li>
<li>Fixed: Provide a secondary build of FrankerFaceZ that uses Babel for transpiling for Microsoft Edge compatibility.</li>
<li>Changed: Start subscribing to the channel topic when viewing a channel for future features such as SRL races and Featured Channel buttons.</li>
<li>Performance: Refactored the React component hooks to allow for less time with a MutationObserver registered.</li>
</ul>
<div class="list-header">4.0.0-beta1.6<span>@66bf9e883f32aba529af</span> <time datetime="2018-03-11">(2018-03-11)</time></div> <div class="list-header">4.0.0-beta1.6<span>@66bf9e883f32aba529af</span> <time datetime="2018-03-11">(2018-03-11)</time></div>
<ul class="chat-menu-content menu-side-padding"> <ul class="chat-menu-content menu-side-padding">
<li>Fixed: Metadata covering chat in theater mode with Swap Sidebars enabled.</li> <li>Fixed: Metadata covering chat in theater mode with Swap Sidebars enabled.</li>

View file

@ -7,10 +7,16 @@
"scripts": { "scripts": {
"start": "webpack-dev-server --config webpack.web.dev.js", "start": "webpack-dev-server --config webpack.web.dev.js",
"build": "webpack --config webpack.web.prod.js --define process.env.NODE_ENV='production'", "build": "webpack --config webpack.web.prod.js --define process.env.NODE_ENV='production'",
"build:babel": "webpack --config webpack.web.babel.js --define process.env.NODE_ENV='production'",
"build:prod": "webpack --config webpack.web.prod.js --define process.env.NODE_ENV='production'", "build:prod": "webpack --config webpack.web.prod.js --define process.env.NODE_ENV='production'",
"build:dev": "webpack --config webpack.web.dev.js" "build:dev": "webpack --config webpack.web.dev.js"
}, },
"devDependencies": { "devDependencies": {
"babel-core": "^6.26.0",
"babel-loader": "^7.1.4",
"babel-plugin-syntax-dynamic-import": "^6.18.0",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-preset-env": "^1.6.1",
"clean-webpack-plugin": "^0.1.17", "clean-webpack-plugin": "^0.1.17",
"copy-webpack-plugin": "^4.3.0", "copy-webpack-plugin": "^4.3.0",
"css-loader": "^0.28.7", "css-loader": "^0.28.7",

View file

@ -7,11 +7,12 @@
const DEBUG = localStorage.ffzDebugMode == 'true' && document.body.classList.contains('ffz-dev') && ! window.Ember, const DEBUG = localStorage.ffzDebugMode == 'true' && document.body.classList.contains('ffz-dev') && ! window.Ember,
SERVER = DEBUG ? '//localhost:8000' : '//cdn.frankerfacez.com', SERVER = DEBUG ? '//localhost:8000' : '//cdn.frankerfacez.com',
BABEL = /Edge/.test(window.navigator.userAgent) ? 'babel/' : '',
FLAVOR = window.Ember ? 'umbral' : 'avalon', FLAVOR = window.Ember ? 'umbral' : 'avalon',
script = document.createElement('script'); script = document.createElement('script');
script.id = 'ffz-script'; script.id = 'ffz-script';
script.src = `${SERVER}/script/${FLAVOR}.js?_=${Date.now()}`; script.src = `${SERVER}/script/${BABEL}${FLAVOR}.js?_=${Date.now()}`;
document.head.appendChild(script); document.head.appendChild(script);
})(); })();

63
webpack.web.babel.js Normal file
View file

@ -0,0 +1,63 @@
const merge = require('webpack-merge');
const common = require('./webpack.web.common.js');
const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
const ManifestPlugin = require('webpack-manifest-plugin');
const config = module.exports = merge(common, {
devtool: 'source-map',
module: {
rules: [{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader'
}]
},
plugins: [
new UglifyJSPlugin({
sourceMap: true,
uglifyOptions: {
compress: {
keep_fnames: true,
keep_classnames: true
},
mangle: {
keep_classnames: true,
keep_fnames: true
}
}
}),
new ManifestPlugin({
map: (data) => {
if ( data.name.endsWith('.scss') )
data.name = data.name.substr(0,data.name.length - 5) + '.css';
return data;
}
})
],
output: {
publicPath: '//cdn.frankerfacez.com/script/babel/',
filename: '[name].[hash].js'
}
});
// This is why we can't have nice things.
// Why can't I just access process.env.NODE_ENV from
// one of these files when I set it with webpack's
// CLI? So stupid.
//
// So here we go.
// This is crap.
// But it works.
for(const rule of config.module.rules) {
if ( rule.use )
for(const use of rule.use)
if ( use.options && use.options.name && use.options.name.startsWith('[name].') )
use.options.name = '[name].[hash].' + use.options.name.slice(7)
}