Send sourcemaps to sentry

package.json

@@ -26,6 +26,7 @@
     "@babel/preset-react": "7.8.3",
     "@moonwalker/pre-flight-check": "1.0.23",
     "@sentry/node": "5.14.2",
+    "@sentry/webpack-plugin": "1.10.0",
     "assets-webpack-plugin": "3.9.12",
     "async": "3.2.0",
     "autoprefixer": "9.7.4",
@@ -51,6 +52,7 @@
     "generate-json-webpack-plugin": "0.3.1",
     "html-minifier": "4.0.0",
     "html-webpack-plugin": "3.2.0",
+    "http-errors": "1.7.3",
     "isomorphic-fetch": "2.2.1",
     "jest": "25.1.0",
     "json-stringify-safe": "5.0.1",

src/serve/constants.js → src/constants.js

@@ -1,16 +1,21 @@
 require('dotenv').config();
 
+module.exports.NODE_ENV = process.env.NODE_ENV || 'development';
 module.exports.PORT = parseInt(process.env.JETPACK_SERVER_PORT, 10) || 9002;
 module.exports.HOST = process.env.JETPACK_SERVER_HOST || '0.0.0.0';
 module.exports.SENTRY_DSN = process.env.JETPACK_SERVER_SENTRY;
-module.exports.ENV = process.env.NODE_ENV || 'development';
+module.exports.ENV = process.env.ENV || process.env.env || '';
 
 module.exports.CONTENT_SVC = process.env.CONTENT_SVC || '127.0.0.1:51051';
 module.exports.SVCNAME = process.env.SVCNAME || 'jetpack-server';
 module.exports.COMMIT = (process.env.COMMIT || 'dev').substring(0, 7);
 module.exports.BUILT = process.env.BUILT || 'n/a';
 module.exports.NAMESPACE = process.env.NAMESPACE || 'default';
 
+// Env specific releases
+module.exports.SERVER_RELEASE = `S-${module.exports.COMMIT}`;
+module.exports.CLIENT_RELEASE = `C-${module.exports.COMMIT}`;
+
 // Static files
 module.exports.STATIC_FILE_PATTERN = /\.(css|bmp|tif|ttf|docx|woff2|js|pict|tiff|eot|xlsx|jpg|csv|eps|woff|xls|jpeg|doc|ejs|otf|pptx|gif|pdf|swf|svg|ps|ico|pls|midi|svgz|class|png|ppt|mid|webp|jar|mp4|mp3)$/;
 module.exports.DEFAULT_LOCALES = [

src/serve/server.js

@@ -2,6 +2,7 @@ const fs = require('fs');
 const os = require('os');
 const url = require('url');
 const path = require('path');
+const createError = require('http-errors');
 const request = require('request');
 const fastify = require('fastify');
 const serveStatic = require('serve-static');
@@ -31,15 +32,16 @@ const {
   NAMESPACE,
   PORT,
   SENTRY_DSN,
+  SERVER_RELEASE,
   STATIC_FILE_PATTERN,
   SVCNAME
-} = require('./constants');
+} = require('../constants');
 
 const log = debug('render');
 
 if (SENTRY_DSN) {
   log('Sentry init');
-  Sentry.init({ dsn: SENTRY_DSN, release: COMMIT, environment: ENV });
+  Sentry.init({ dsn: SENTRY_DSN, release: SERVER_RELEASE, environment: ENV });
 } else {
   log('Sentry skipped');
 }
@@ -54,6 +56,7 @@ const render = require(renderFilepath).default; // eslint-disable-line import/no
 
 let ERROR_MESSAGE = '';
 const errorHandler = (err, req, reply) => {
+  // Read 500.html on first error
   if (!ERROR_MESSAGE) {
     try {
       ERROR_MESSAGE = fs.readFileSync(path.join(paths.output.path, '500.html'), 'utf-8');
@@ -70,8 +73,10 @@ const errorHandler = (err, req, reply) => {
     Sentry.captureException(err);
   });
 
+  const statusCode = err.statusCode || 500;
+
   reply
-    .code(500)
+    .code(statusCode)
     .type('text/html')
     .send(ERROR_MESSAGE);
 };
@@ -122,8 +127,9 @@ const permanentRedirect = (to) => (_, reply) => {
 const renderRouteHandler = (localesRegex, defaultLocale) => async (req, reply) => {
   const u = url.parse(req.raw.url);
 
+  // Skip passing static file urls to the renderer
   if (STATIC_FILE_PATTERN.test(u.pathname)) {
-    return reply.callNotFound();
+    throw new createError.NotFound();
   }
 
   if (!hasTrailingSlash(u.pathname)) {
@@ -142,13 +148,7 @@ const renderRouteHandler = (localesRegex, defaultLocale) => async (req, reply) =
     return permanentRedirect(`${undef}/${u.search || ''}`)(req, reply);
   }
 
-  let data;
-
-  try {
-    data = await render({ path: u.pathname, assets });
-  } catch (err) {
-    throw new Error(err);
-  }
+  const data = await render({ path: u.pathname, assets });
 
   return reply
     .header('Content-Type', 'text/html')

src/utils/index.js

@@ -1,7 +1,10 @@
 const { execSync } = require('child_process');
+
+const { ENV, NAMESPACE, CLIENT_RELEASE } = require('../constants');
 const debug = require('./debug');
 const perf = require('./perf');
 
+// @TODO use src/constants
 const getCommitId = () =>
   process.env.COMMIT ||
   execSync('git rev-parse --short HEAD')
@@ -32,11 +35,7 @@ const stripTrailingSlash = (pathname) => {
 };
 
 const getEnvMiddleware = () => (_, reply) => {
-  const config = {
-    ENV: process.env.ENV || process.env.env || '',
-    NAMESPACE: process.env.NAMESPACE || 'default',
-    RELEASE: process.env.COMMIT || ''
-  };
+  const config = { ENV, NAMESPACE, RELEASE: CLIENT_RELEASE };
 
   reply
     .header('Cache-Control', 'no-store, no-cache, must-revalidate')

src/webpack/defaults.js

@@ -1,4 +1,6 @@
 const path = require('path');
+
+const { NODE_ENV } = require('../constants');
 const { getCommitId } = require('../utils');
 
 const pwd = (...p) => path.resolve(process.cwd(), ...p);
@@ -44,7 +46,7 @@ module.exports = {
     }
   },
   minimize: {
-    enabled: !!process.env.ENV,
+    enabled: NODE_ENV !== 'development',
     minifyOptions: {
       removeComments: true,
       collapseWhitespace: true,

src/webpack/getRoutes.js

@@ -1,6 +1,7 @@
 const async = require('async');
 const fetch = require('isomorphic-fetch');
 
+const { ENV } = require('../constants');
 const { debug } = require('../utils');
 
 const log = debug('fetch', 'routes');
@@ -38,7 +39,7 @@ module.exports = ({ queryApiUrl, productName }) => {
   };
 
   log('PRD:', productName);
-  log('ENV:', process.env.ENV || process.env.env || process.env.NODE_ENV || 'development');
+  log('ENV:', ENV);
   log('API:', queryApiUrl);
   log('REQ:', params.method, params.body);
 

src/webpack/index.js

@@ -4,9 +4,10 @@ const webpack = require('webpack');
 const path = require('path');
 const { spawn } = require('child_process');
 
+const { ENV } = require('../constants');
+const { debug } = require('../utils');
 const { context, config } = require('./defaults');
 const { renderConfig, clientConfig } = require('./webpack.config.prd');
-const { debug } = require('../utils');
 
 const printStats = (mode, stats) => {
   process.stdout.write('\n');
@@ -54,7 +55,7 @@ const compileWebpackConfig = (webpackConfig) =>
 const buildClient = () => {
   const log = debug('build:client');
   log('PRD:', config.productName);
-  log('ENV:', process.env.ENV);
+  log('ENV:', ENV);
   log('API:', config.queryApiUrl);
 
   return compileWebpackConfig(clientConfig).then((stats) => printStats('Client', stats));
@@ -63,7 +64,7 @@ const buildClient = () => {
 const buildRender = () => {
   const log = debug('build:render');
   log('PRD:', config.productName);
-  log('ENV:', process.env.ENV);
+  log('ENV:', ENV);
   log('API:', config.queryApiUrl);
 
   return compileWebpackConfig(renderConfig).then((renderStats) =>

src/webpack/webpack.config.prd.js

@@ -3,7 +3,9 @@ const { CleanWebpackPlugin } = require('clean-webpack-plugin');
 const CopyWebpackPlugin = require('copy-webpack-plugin');
 const AssetsPlugin = require('assets-webpack-plugin');
 const TerserPlugin = require('terser-webpack-plugin');
+const SentryPlugin = require("@sentry/webpack-plugin");
 
+const { SERVER_RELEASE } = require('../constants');
 const mergeConfigs = require('./mergeConfigs');
 const settings = require('./defaults');
 const {
@@ -127,9 +129,13 @@ const renderConfig = mergeConfigs(
         }),
         new webpack.optimize.LimitChunkCountPlugin({
           maxChunks: 1
+        }),
+        new SentryPlugin({
+          include: paths.render.path,
+          release: SERVER_RELEASE
         })
       ],
-      devtool: false,
+      devtool: 'source-map',
       optimization: {
         minimize: false
       }