Skip to content
This repository was archived by the owner on Aug 13, 2020. It is now read-only.

Commit 77b1748

Browse files
andrewmcodesandrewmcodes
authored
move purgecss to webpack (#1178)
�
1 parent c09cbfb commit 77b1748

File tree

26 files changed

+123
-46
lines changed

26 files changed

+123
-46
lines changed

‎.circleci/config.yml

+14-14
Original file line numberDiff line numberDiff line change
@@ -34,23 +34,23 @@ jobs:
3434
- restore_cache:
3535
name: Restore gem cache
3636
keys:
37-
- gem-cache-v5-{{ arch }}-{{ .Branch }}-{{ checksum "Gemfile.lock" }}
38-
- gem-cache-v5-{{ arch }}-{{ .Branch }}
39-
- gem-cache-v5-{{ arch }}
40-
- gem-cache-v5
37+
- gem-cache-v6-{{ arch }}-{{ .Branch }}-{{ checksum "Gemfile.lock" }}
38+
- gem-cache-v6-{{ arch }}-{{ .Branch }}
39+
- gem-cache-v6-{{ arch }}
40+
- gem-cache-v6
4141
- restore_cache:
4242
name: Restore yarn cache
4343
keys:
44-
- yarn-cache-v5-{{ arch }}-{{ .Branch }}-{{ checksum "yarn.lock" }}
45-
- yarn-cache-v5-{{ arch }}-{{ .Branch }}
46-
- yarn-cache-v5-{{ arch }}
47-
- yarn-cache-v5
44+
- yarn-cache-v6-{{ arch }}-{{ .Branch }}-{{ checksum "yarn.lock" }}
45+
- yarn-cache-v6-{{ arch }}-{{ .Branch }}
46+
- yarn-cache-v6-{{ arch }}
47+
- yarn-cache-v6
4848
- restore_cache:
4949
name: Restore assets cache
5050
keys:
51-
- assets-cache-v5-{{ checksum "dependency_checksum" }}-{{ arch }}-{{ .Branch }}
52-
- assets-cache-v5-{{ checksum "dependency_checksum" }}-{{ arch }}
53-
- assets-cache-v5-{{ checksum "dependency_checksum" }}
51+
- assets-cache-v6-{{ checksum "dependency_checksum" }}-{{ arch }}-{{ .Branch }}
52+
- assets-cache-v6-{{ checksum "dependency_checksum" }}-{{ arch }}
53+
- assets-cache-v6-{{ checksum "dependency_checksum" }}
5454
- run:
5555
name: Install gem dependencies
5656
command: |
@@ -66,20 +66,20 @@ jobs:
6666
name: Save gem cache
6767
paths:
6868
- vendor/bundle
69-
key: gem-cache-v5-{{ arch }}-{{ .Branch }}-{{ checksum "Gemfile.lock" }}
69+
key: gem-cache-v6-{{ arch }}-{{ .Branch }}-{{ checksum "Gemfile.lock" }}
7070
- save_cache:
7171
name: Save yarn cache
7272
paths:
7373
- ~/.cache/yarn
74-
key: yarn-cache-v5-{{ arch }}-{{ .Branch }}-{{ checksum "yarn.lock" }}
74+
key: yarn-cache-v6-{{ arch }}-{{ .Branch }}-{{ checksum "yarn.lock" }}
7575
- save_cache:
7676
name: Save assets cache
7777
paths:
7878
- public/packs-test
7979
- public/assets
8080
- tmp/cache/webpacker
8181
- tmp/cache/assets/sprockets
82-
key: assets-cache-v5-{{ checksum "dependency_checksum" }}-{{ arch }}-{{ .Branch }}
82+
key: assets-cache-v6-{{ checksum "dependency_checksum" }}-{{ arch }}-{{ .Branch }}
8383
- run:
8484
name: Set up DB
8585
command: bundle exec rails db:drop db:create db:structure:load --trace

‎app/javascript/advertisements/@responsive_footer/theme.scss

+2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* purgecss start ignore */
12
div#cf[data-template='responsive_footer'] {
23
&[data-theme='dark'] {
34
font-family: Helvetica Neue, Helvetica, Arial;
@@ -100,3 +101,4 @@ div#cf[data-template='responsive_footer'] {
100101
}
101102
}
102103
}
104+
/* purgecss end ignore */

‎app/javascript/advertisements/bottom-bar/theme.scss

+2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* purgecss start ignore */
12
$label-text: 'Ad';
23

34
div#cf[data-template='bottom-bar'] {
@@ -183,3 +184,4 @@ div#cf[data-template='bottom-bar'] {
183184
}
184185
}
185186
}
187+
/* purgecss end ignore */

‎app/javascript/advertisements/centered/theme.scss

+2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* purgecss start ignore */
12
div#cf[data-template='centered'] {
23
&[data-theme='dark'] {
34
a {
@@ -101,3 +102,4 @@ div#cf[data-template='centered'] {
101102
}
102103
}
103104
}
105+
/* purgecss end ignore */

‎app/javascript/advertisements/default/theme.scss

+2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* purgecss start ignore */
12
div#cf[data-template='default'] {
23
&[data-theme='dark'] {
34
margin: 0 auto;
@@ -94,3 +95,4 @@ div#cf[data-template='default'] {
9495
}
9596
}
9697
}
98+
/* purgecss end ignore */

‎app/javascript/advertisements/docsify/theme.scss

+2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* purgecss start ignore */
12
div#cf[data-template='docsify'] {
23
&[data-theme='dark'] {
34
margin: 0 auto;
@@ -123,3 +124,4 @@ div#cf[data-template='docsify'] {
123124
}
124125
}
125126
}
127+
/* purgecss end ignore */

‎app/javascript/advertisements/horizontal/theme.scss

+2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* purgecss start ignore */
12
$label-text: 'Ad';
23

34
div#cf[data-template='horizontal'] {
@@ -107,3 +108,4 @@ div#cf[data-template='horizontal'] {
107108
}
108109
}
109110
}
111+
/* purgecss end ignore */

‎app/javascript/advertisements/image-centered/theme.scss

+2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* purgecss start ignore */
12
div#cf[data-template='image-centered'] {
23
&[data-theme='dark'] {
34
max-width: 280px;
@@ -109,3 +110,4 @@ div#cf[data-template='image-centered'] {
109110
}
110111
}
111112
}
113+
/* purgecss end ignore */

‎app/javascript/advertisements/image-only/theme.scss

+2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* purgecss start ignore */
12
div#cf[data-template='image-only'] {
23
&[data-theme='dark'] {
34
max-width: 280px;
@@ -119,3 +120,4 @@ div#cf[data-template='image-only'] {
119120
}
120121
}
121122
}
123+
/* purgecss end ignore */

‎app/javascript/advertisements/index.js

+2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* purgecss start ignore */
12
import './index.scss'
23
import Mustache from 'mustache'
34
const templates = {}
@@ -175,3 +176,4 @@ class CodeFundAd {
175176
}
176177

177178
window.CodeFundAd = CodeFundAd
179+
/* purgecss end ignore */

‎app/javascript/advertisements/index.scss

+2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* purgecss start ignore */
12
// default styles for all ads
23
#cf[data-template] {
34
&[data-theme='dark'],
@@ -19,3 +20,4 @@
1920
}
2021
}
2122
}
23+
/* purgecss end ignore */

‎app/javascript/advertisements/media/theme.scss

+2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* purgecss start ignore */
12
div#cf[data-template='media'] {
23
margin: 0 auto;
34

@@ -93,3 +94,4 @@ div#cf[data-template='media'] {
9394
}
9495
}
9596
}
97+
/* purgecss end ignore */

‎app/javascript/advertisements/rectangle-narrow/theme.scss

+2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* purgecss start ignore */
12
div#cf[data-template='rectangle-narrow'][data-theme='dark'] {
23
margin: 0 auto;
34
max-width: 330px;
@@ -90,3 +91,4 @@ div#cf[data-template='rectangle-narrow'][data-theme='light'] {
9091
}
9192
}
9293
}
94+
/* purgecss end ignore */

‎app/javascript/advertisements/smart-bar/theme.scss

+2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* purgecss start ignore */
12
$bg-color: #2c6ac7;
23
$text-color: #ffffff;
34
$button-bg-color: #ffffff;
@@ -169,3 +170,4 @@ div#cf[data-template='smart-bar'] {
169170
top: -196px;
170171
}
171172
}
173+
/* purgecss end ignore */

‎app/javascript/advertisements/sponsored-text/theme.scss

+4-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
1-
ins#cf[data-template='sponsored-text'][data-theme='dark'] {
1+
/* purgecss start ignore */
2+
#cf[data-template='sponsored-text'][data-theme='dark'] {
23
text-decoration: none !important;
34
color: #aaaaaa;
45
line-height: 1.7;
@@ -57,7 +58,7 @@ ins#cf[data-template='sponsored-text'][data-theme='dark'] {
5758
}
5859
}
5960

60-
ins#cf[data-template='sponsored-text'][data-theme='light'] {
61+
#cf[data-template='sponsored-text'][data-theme='light'] {
6162
text-decoration: none !important;
6263
color: #6c757e;
6364
line-height: 1.7;
@@ -115,3 +116,4 @@ ins#cf[data-template='sponsored-text'][data-theme='light'] {
115116
}
116117
}
117118
}
119+
/* purgecss end ignore */

‎app/javascript/advertisements/square/theme.scss

+2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* purgecss start ignore */
12
div#cf[data-template='square'] {
23
max-width: 255px;
34
margin: 0 auto;
@@ -83,3 +84,4 @@ div#cf[data-template='square'] {
8384
}
8485
}
8586
}
87+
/* purgecss end ignore */

‎app/javascript/advertisements/sticky-box/theme.scss

+2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* purgecss start ignore */
12
div#cf[data-template='sticky-box'] {
23
&[data-theme='dark'] {
34
}
@@ -114,3 +115,4 @@ div#cf[data-template='sticky-box'] {
114115
}
115116
}
116117
}
118+
/* purgecss end ignore */

‎app/javascript/advertisements/text/theme.scss

+2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* purgecss start ignore */
12
div#cf[data-template='text'][data-theme='dark'] {
23
color: #77838f;
34
text-decoration: none !important;
@@ -33,3 +34,4 @@ div#cf[data-template='text'][data-theme='light'] {
3334
color: #3498db;
3435
}
3536
}
37+
/* purgecss end ignore */

‎app/javascript/advertisements/top-bar/theme.scss

+2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* purgecss start ignore */
12
$bg-color: #2c6ac7;
23
$text-color: #ffffff;
34
$button-bg-color: #ffffff;
@@ -149,3 +150,4 @@ div#cf[data-template='top-bar'] {
149150
}
150151
}
151152
}
153+
/* purgecss end ignore */

‎app/javascript/advertisements/vertical/theme.scss

+2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* purgecss start ignore */
12
div#cf[data-template='vertical'][data-theme='dark'] {
23
width: 125px;
34
margin: 0 auto;
@@ -125,3 +126,4 @@ div#cf[data-template='vertical'][data-theme='light'] {
125126
}
126127
}
127128
}
129+
/* purgecss end ignore */

‎app/javascript/themes/current/stylesheets/application.scss

+2
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,10 @@
1+
/* purgecss start ignore */
12
@import '~select2/dist/css/select2';
23
@import '~select2-bootstrap-theme/dist/select2-bootstrap';
34
@import '~noty/src/noty';
45
@import '~noty/src/themes/mint';
56
@import '~bootstrap-daterangepicker/daterangepicker';
7+
/* purgecss end ignore */
68
@import '~trix/dist/trix';
79
@import 'mixins';
810
@import 'theme';

‎app/javascript/themes/current/stylesheets/components/select2.scss

+2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* purgecss start ignore */
12
// =========== Select Boxes ===========
23
.select2-container--bootstrap {
34
.select2-results__option[aria-selected='true'],
@@ -40,3 +41,4 @@
4041
}
4142
}
4243
}
44+
/* purgecss end ignore */

‎config/webpack/environment.js

+19
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
11
const { environment } = require('@rails/webpacker')
22
const erb = require('./loaders/erb')
33
const webpack = require('webpack')
4+
const path = require('path')
5+
const PurgecssPlugin = require('purgecss-webpack-plugin')
6+
const glob = require('glob-all')
47

58
environment.plugins.prepend(
69
'Provide',
@@ -19,5 +22,21 @@ environment.plugins.prepend(
1922
new webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /en|pl/)
2023
)
2124

25+
environment.plugins.append(
26+
'PurgecssPlugin',
27+
new PurgecssPlugin({
28+
paths: glob.sync([
29+
path.join(__dirname, '../../app/javascript/**/*.js'),
30+
path.join(__dirname, '../../app/views/**/*.js.erb'),
31+
path.join(__dirname, '../../app/views/**/*.html.erb'),
32+
path.join(__dirname, '../../app/helpers/**/*.rb')
33+
]),
34+
whitelist: ['select', 'optional', 'user_skills', 'active', 'show'],
35+
whitelistPatterns: [/select2$/, /stacked$/, /cf$/],
36+
whitelistPatternsChildren: [/select2$/, /stacked$/, /cf$/]
37+
})
38+
)
39+
2240
environment.loaders.prepend('erb', erb)
41+
2342
module.exports = environment

‎package.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,6 @@
1919
"@fullcalendar/bootstrap": "^4.3.0",
2020
"@fullcalendar/core": "^4.3.1",
2121
"@fullcalendar/daygrid": "^4.3.0",
22-
"@fullhuman/postcss-purgecss": "^2.1.0",
2322
"@rails/actioncable": "^6.0.0",
2423
"@rails/activestorage": "^6.0.0",
2524
"@rails/ujs": "^6.0.0",
@@ -32,6 +31,7 @@
3231
"cable_ready": "^4.0.7",
3332
"clipboard": "^2.0.4",
3433
"codesandbox": "^2.1.10",
34+
"glob-all": "^3.2.1",
3535
"jquery": "^3.4.1",
3636
"jquery-validation": "^1.19.1",
3737
"lodash": "^4.17.15",
@@ -44,6 +44,7 @@
4444
"popper.js": "^1.16.0",
4545
"postcss-flexbugs-fixes": "^4.1.0",
4646
"postcss-preset-env": "^6.6.0",
47+
"purgecss-webpack-plugin": "^2.1.0",
4748
"rails-erb-loader": "^5.5.2",
4849
"select2": "^4.0.6-rc.1",
4950
"select2-bootstrap-theme": "^0.1.0-beta.10",

‎postcss.config.js

+2-21
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
let environment = {
1+
module.exports = {
22
plugins: [
33
require('postcss-import'),
44
require('postcss-flexbugs-fixes'),
@@ -7,25 +7,6 @@ let environment = {
77
flexbox: 'no-2009'
88
},
99
stage: 3
10-
}),
11-
]
12-
}
13-
14-
if (process.env.RAILS_ENV === "production") {
15-
environment.plugins.push(
16-
require('@fullhuman/postcss-purgecss')({
17-
content: [
18-
'./app/**/*.html.erb',
19-
'./app/**/*.js.erb',
20-
'./app/helpers/**/*.rb',
21-
'./app/javascript/**/*.js'
22-
],
23-
css: [],
24-
whitelist: ['select', 'optional', 'user_skills', 'active', 'show'],
25-
whitelistPatterns: [/select2$/, /stacked$/],
26-
whitelistPatternsChildren: [/select2$/, /stacked$/]
2710
})
28-
)
11+
]
2912
}
30-
31-
module.exports = environment

0 commit comments

Comments
 (0)