Merge pull request #4066 from nasa-gibs/release

Release v3.39.1 to main

package.json

@@ -1,6 +1,6 @@
 {
   "name": "worldview",
-  "version": "3.39.0",
+  "version": "3.39.1",
   "description": "Interactive interface for browsing full-resolution, global satellite imagery",
   "keywords": [
     "NASA",
@@ -106,6 +106,7 @@
     "css-hot-loader": "^1.4.1",
     "css-loader": "^3.5.2",
     "css-minimizer-webpack-plugin": "^4.1.0",
+    "css-url-relative-plugin": "^1.1.0",
     "cssnano": "^5.1.13",
     "eslint": "^7.5.0",
     "eslint-config-airbnb": "^18.0.1",

tasks/start.js

@@ -7,6 +7,7 @@ const port = process.env.PORT || 3000;
 const app = express();
 app.use(compression());
 app.use(express.static(path.join(__dirname, '../web')));
+// app.use('/test', express.static(path.join(__dirname, '../build/worldview'))); // test dist in a "test" sub directory
 app.set('port', port);
 app.listen(port, () => {
   console.log(`Worldview is available at http://localhost:${port}`);

web/index.html

@@ -61,7 +61,7 @@
   <meta name="twitter:card" content="summary">
   <meta name="twitter:site" content="@NASAEarth">
 
-  <link type="text/css" rel="Stylesheet" href="/build/wv.css?v=@BUILD_NONCE@">
+  <link type="text/css" rel="Stylesheet" href="build/wv.css?v=@BUILD_NONCE@">
   <script type="text/javascript" src="build/wv.js?v=@BUILD_NONCE@"></script>
 
   <link rel="apple-touch-icon" href="images/wv-logo-apple-icon.png">

web/js/containers/sidebar/sidebar.js

@@ -199,8 +199,8 @@ class Sidebar extends React.Component {
       ? 'Click to Open This @NAME@ Map in a New Tab'
       : 'Click to Reset @NAME@ to Defaults';
     const embedWVLogoLink = isEmbedModeActive ? permalink : '/';
-    const mobileImgURL = '../../../brand/images/wv-logo-mobile.svg?v=@BUILD_NONCE@';
-    const desktopImgURL = '../../../brand/images/wv-logo.svg?v=@BUILD_NONCE@';
+    const mobileImgURL = 'brand/images/wv-logo-mobile.svg?v=@BUILD_NONCE@';
+    const desktopImgURL = 'brand/images/wv-logo.svg?v=@BUILD_NONCE@';
 
     const sidebarStyle = isMobile ? {
       background: `url(${mobileImgURL}) no-repeat center rgb(40 40 40 / 85%)`,

webpack.config.js

@@ -6,11 +6,13 @@ const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 const CssMinimizerPlugin = require('css-minimizer-webpack-plugin');
 const MomentLocalesPlugin = require('moment-locales-webpack-plugin');
 const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin');
+const CssUrlRelativePlugin = require('css-url-relative-plugin');
 
 const devMode = process.env.NODE_ENV !== 'production';
 
 const pluginSystem = [
   new MomentLocalesPlugin(),
+  new CssUrlRelativePlugin(),
   new MiniCssExtractPlugin({
     filename: 'wv.css',
   }),
@@ -60,7 +62,7 @@ module.exports = {
   output: {
     filename: 'wv.js',
     path: path.resolve(__dirname, 'web/build/'),
-    publicPath: '/build/',
+    publicPath: './',
     pathinfo: false,
     clean: true,
   },