Configure Browserslist environments

Author: colinrotherham

.browserslistrc

@@ -1,3 +1,7 @@
+[javascripts]
+supports es6-module
+
+[stylesheets]
 > 0.1% in GB and not dead
 last 6 Chrome versions
 last 6 Firefox versions

babel.config.js

@@ -1,4 +1,5 @@
 module.exports = {
+  browserslistEnv: 'javascripts',
   presets: [
     [
       '@babel/preset-env',

shared/tasks/scripts.mjs

@@ -49,7 +49,7 @@ export function webpackJS(done) {
           colors: true,
           errors: false
         },
-        target: 'browserslist'
+        target: 'browserslist:javascripts'
       }).on('error', (error) => {
         done(
           new PluginError('webpackJS', error, {

shared/tasks/styles.mjs

@@ -53,7 +53,13 @@ export function compileCSS(done) {
         }
       })
     )
-    .pipe(postcss([autoprefixer()]))
+    .pipe(
+      postcss([
+        autoprefixer({
+          env: 'stylesheets'
+        })
+      ])
+    )
     .pipe(
       gulp.dest('dist/', {
         sourcemaps: '.'
@@ -70,7 +76,13 @@ export function minifyCSS() {
       .src('dist/nhsuk.css', {
         sourcemaps: true
       })
-      .pipe(postcss([cssnano()]))
+      .pipe(
+        postcss([
+          cssnano({
+            env: 'stylesheets'
+          })
+        ])
+      )
 
       // Output minified
       .pipe(