Skip to content

Commit edd8ce7

Browse files
committed
fix: run build js through babel
Fixes #389
1 parent 3ca7010 commit edd8ce7

File tree

15 files changed

+148
-143
lines changed

15 files changed

+148
-143
lines changed

.browserslistrc-smallbuild

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
> 2%
2+
not dead

README.md

+16
Original file line numberDiff line numberDiff line change
@@ -54,6 +54,7 @@ Development - https://sciactive.github.io/pnotify/
5454
- [Stacks](#Stacks)
5555
- [Example Stack](#Example-Stack)
5656
- [Features](#Features)
57+
- [Browser Compatibility and Build Size](#Browser-Compatibility-and-Build-Size)
5758
- [Licensing and Additional Info](#Licensing-and-Additional-Info)
5859
<!-- TOC END -->
5960

@@ -1103,6 +1104,21 @@ alert({
11031104
* Works with bundlers (Webpack, Rollup, etc.).
11041105
* No dependencies for most features.
11051106

1107+
# Browser Compatibility and Build Size
1108+
1109+
PNotify provides prebuilt JS files, and those files are run through Babel to provide compatibility with older browsers. As such, their build size grows to maintain compatibility. If this is not acceptable, you can build much smaller (~80%) files yourself with:
1110+
1111+
```sh
1112+
git clone https://github.com/sciactive/pnotify.git
1113+
cd pnotify
1114+
npm i
1115+
mv .browserslistrc-smallbuild .browserslistrc
1116+
npx lerna bootstrap
1117+
npm build
1118+
```
1119+
1120+
You should now have `dist` folders in all the packages with smaller (but only compatible with newer browsers) build files. Note that this doesn't apply to Svelte projects, because they build the PNotify *.svelte source files anyway.
1121+
11061122
# Licensing and Additional Info
11071123

11081124
Copyright 2009-2020 Hunter Perrin

packages/animate/webpack.config.js

+10-11
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,16 @@ module.exports = {
3131
module: {
3232
rules: [
3333
{
34-
test: /\.(html|svelte)$/,
34+
test: /\.(js|mjs|svelte)$/,
35+
use: {
36+
loader: 'babel-loader',
37+
options: {
38+
presets: ['@babel/preset-env']
39+
}
40+
}
41+
},
42+
{
43+
test: /\.svelte$/,
3544
exclude: /\/node_modules\//,
3645
use: {
3746
loader: 'svelte-loader',
@@ -47,16 +56,6 @@ module.exports = {
4756
MiniCssExtractPlugin.loader,
4857
'css-loader'
4958
]
50-
},
51-
{
52-
test: /\.js$/,
53-
exclude: /node_modules/,
54-
use: {
55-
loader: 'babel-loader',
56-
options: {
57-
presets: ['@babel/preset-env']
58-
}
59-
}
6059
}
6160
]
6261
}

packages/bootstrap3/webpack.config.js

+10-11
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,16 @@ module.exports = {
3131
module: {
3232
rules: [
3333
{
34-
test: /\.(html|svelte)$/,
34+
test: /\.(js|mjs|svelte)$/,
35+
use: {
36+
loader: 'babel-loader',
37+
options: {
38+
presets: ['@babel/preset-env']
39+
}
40+
}
41+
},
42+
{
43+
test: /\.svelte$/,
3544
exclude: /\/node_modules\//,
3645
use: {
3746
loader: 'svelte-loader',
@@ -47,16 +56,6 @@ module.exports = {
4756
MiniCssExtractPlugin.loader,
4857
'css-loader'
4958
]
50-
},
51-
{
52-
test: /\.js$/,
53-
exclude: /node_modules/,
54-
use: {
55-
loader: 'babel-loader',
56-
options: {
57-
presets: ['@babel/preset-env']
58-
}
59-
}
6059
}
6160
]
6261
}

packages/bootstrap4/webpack.config.js

+10-11
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,16 @@ module.exports = {
3131
module: {
3232
rules: [
3333
{
34-
test: /\.(html|svelte)$/,
34+
test: /\.(js|mjs|svelte)$/,
35+
use: {
36+
loader: 'babel-loader',
37+
options: {
38+
presets: ['@babel/preset-env']
39+
}
40+
}
41+
},
42+
{
43+
test: /\.svelte$/,
3544
exclude: /\/node_modules\//,
3645
use: {
3746
loader: 'svelte-loader',
@@ -47,16 +56,6 @@ module.exports = {
4756
MiniCssExtractPlugin.loader,
4857
'css-loader'
4958
]
50-
},
51-
{
52-
test: /\.js$/,
53-
exclude: /node_modules/,
54-
use: {
55-
loader: 'babel-loader',
56-
options: {
57-
presets: ['@babel/preset-env']
58-
}
59-
}
6059
}
6160
]
6261
}

packages/confirm/webpack.config.js

+10-11
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,16 @@ module.exports = {
3131
module: {
3232
rules: [
3333
{
34-
test: /\.(html|svelte)$/,
34+
test: /\.(js|mjs|svelte)$/,
35+
use: {
36+
loader: 'babel-loader',
37+
options: {
38+
presets: ['@babel/preset-env']
39+
}
40+
}
41+
},
42+
{
43+
test: /\.svelte$/,
3544
exclude: /\/node_modules\//,
3645
use: {
3746
loader: 'svelte-loader',
@@ -47,16 +56,6 @@ module.exports = {
4756
MiniCssExtractPlugin.loader,
4857
'css-loader'
4958
]
50-
},
51-
{
52-
test: /\.js$/,
53-
exclude: /node_modules/,
54-
use: {
55-
loader: 'babel-loader',
56-
options: {
57-
presets: ['@babel/preset-env']
58-
}
59-
}
6059
}
6160
]
6261
}

packages/core/webpack.config.js

+10-11
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,16 @@ module.exports = {
3636
module: {
3737
rules: [
3838
{
39-
test: /\.(html|svelte)$/,
39+
test: /\.(js|mjs|svelte)$/,
40+
use: {
41+
loader: 'babel-loader',
42+
options: {
43+
presets: ['@babel/preset-env']
44+
}
45+
}
46+
},
47+
{
48+
test: /\.svelte$/,
4049
exclude: /\/node_modules\//,
4150
use: {
4251
loader: 'svelte-loader',
@@ -52,16 +61,6 @@ module.exports = {
5261
MiniCssExtractPlugin.loader,
5362
'css-loader'
5463
]
55-
},
56-
{
57-
test: /\.js$/,
58-
exclude: /node_modules/,
59-
use: {
60-
loader: 'babel-loader',
61-
options: {
62-
presets: ['@babel/preset-env']
63-
}
64-
}
6564
}
6665
]
6766
}

packages/countdown/webpack.config.js

+10-11
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,16 @@ module.exports = {
3131
module: {
3232
rules: [
3333
{
34-
test: /\.(html|svelte)$/,
34+
test: /\.(js|mjs|svelte)$/,
35+
use: {
36+
loader: 'babel-loader',
37+
options: {
38+
presets: ['@babel/preset-env']
39+
}
40+
}
41+
},
42+
{
43+
test: /\.svelte$/,
3544
exclude: /\/node_modules\//,
3645
use: {
3746
loader: 'svelte-loader',
@@ -47,16 +56,6 @@ module.exports = {
4756
MiniCssExtractPlugin.loader,
4857
'css-loader'
4958
]
50-
},
51-
{
52-
test: /\.js$/,
53-
exclude: /node_modules/,
54-
use: {
55-
loader: 'babel-loader',
56-
options: {
57-
presets: ['@babel/preset-env']
58-
}
59-
}
6059
}
6160
]
6261
}

packages/desktop/webpack.config.js

+10-11
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,16 @@ module.exports = {
3131
module: {
3232
rules: [
3333
{
34-
test: /\.(html|svelte)$/,
34+
test: /\.(js|mjs|svelte)$/,
35+
use: {
36+
loader: 'babel-loader',
37+
options: {
38+
presets: ['@babel/preset-env']
39+
}
40+
}
41+
},
42+
{
43+
test: /\.svelte$/,
3544
exclude: /\/node_modules\//,
3645
use: {
3746
loader: 'svelte-loader',
@@ -47,16 +56,6 @@ module.exports = {
4756
MiniCssExtractPlugin.loader,
4857
'css-loader'
4958
]
50-
},
51-
{
52-
test: /\.js$/,
53-
exclude: /node_modules/,
54-
use: {
55-
loader: 'babel-loader',
56-
options: {
57-
presets: ['@babel/preset-env']
58-
}
59-
}
6059
}
6160
]
6261
}

packages/font-awesome4/webpack.config.js

+10-11
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,16 @@ module.exports = {
3131
module: {
3232
rules: [
3333
{
34-
test: /\.(html|svelte)$/,
34+
test: /\.(js|mjs|svelte)$/,
35+
use: {
36+
loader: 'babel-loader',
37+
options: {
38+
presets: ['@babel/preset-env']
39+
}
40+
}
41+
},
42+
{
43+
test: /\.svelte$/,
3544
exclude: /\/node_modules\//,
3645
use: {
3746
loader: 'svelte-loader',
@@ -47,16 +56,6 @@ module.exports = {
4756
MiniCssExtractPlugin.loader,
4857
'css-loader'
4958
]
50-
},
51-
{
52-
test: /\.js$/,
53-
exclude: /node_modules/,
54-
use: {
55-
loader: 'babel-loader',
56-
options: {
57-
presets: ['@babel/preset-env']
58-
}
59-
}
6059
}
6160
]
6261
}

packages/font-awesome5-fix/webpack.config.js

+10-11
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,16 @@ module.exports = {
3131
module: {
3232
rules: [
3333
{
34-
test: /\.(html|svelte)$/,
34+
test: /\.(js|mjs|svelte)$/,
35+
use: {
36+
loader: 'babel-loader',
37+
options: {
38+
presets: ['@babel/preset-env']
39+
}
40+
}
41+
},
42+
{
43+
test: /\.svelte$/,
3544
exclude: /\/node_modules\//,
3645
use: {
3746
loader: 'svelte-loader',
@@ -47,16 +56,6 @@ module.exports = {
4756
MiniCssExtractPlugin.loader,
4857
'css-loader'
4958
]
50-
},
51-
{
52-
test: /\.js$/,
53-
exclude: /node_modules/,
54-
use: {
55-
loader: 'babel-loader',
56-
options: {
57-
presets: ['@babel/preset-env']
58-
}
59-
}
6059
}
6160
]
6261
}

packages/font-awesome5/webpack.config.js

+10-11
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,16 @@ module.exports = {
3131
module: {
3232
rules: [
3333
{
34-
test: /\.(html|svelte)$/,
34+
test: /\.(js|mjs|svelte)$/,
35+
use: {
36+
loader: 'babel-loader',
37+
options: {
38+
presets: ['@babel/preset-env']
39+
}
40+
}
41+
},
42+
{
43+
test: /\.svelte$/,
3544
exclude: /\/node_modules\//,
3645
use: {
3746
loader: 'svelte-loader',
@@ -47,16 +56,6 @@ module.exports = {
4756
MiniCssExtractPlugin.loader,
4857
'css-loader'
4958
]
50-
},
51-
{
52-
test: /\.js$/,
53-
exclude: /node_modules/,
54-
use: {
55-
loader: 'babel-loader',
56-
options: {
57-
presets: ['@babel/preset-env']
58-
}
59-
}
6059
}
6160
]
6261
}

0 commit comments

Comments
 (0)