Build sourcemap

scripts/build-dist.js

@@ -1,5 +1,5 @@
 #!/usr/bin/env node
-
+const path = require('path');
 const childProcess = require('child_process');
 const fse = require('fs-extra');
 const args = process.argv.slice(2);
@@ -8,19 +8,40 @@ const generateDistComponentMap = require('./generate-components-map');
 
 console.log('Building components library');
 
+function runBabel(inputDir='src', outputDir='dist') {
+  console.log('running babel...');
+  const babelResult = childProcess.spawnSync('./node_modules/.bin/babel', ['--config-file', './babel.dist.config.json', '--out-dir', outputDir, inputDir]);
+  if (babelResult.status === 0) {
+    console.log(String(babelResult.stdout));
+  } else {
+    console.log(String(babelResult.stderr));
+    process.exit(1);
+  }
+}
+
 if (args.includes('--clean')) {
   console.log('removing dist folder...');
   fse.rmdirSync('dist', { recursive: true });
 }
 
-console.log('runing babel...');
-const babelResult = childProcess.spawnSync('babel', '--config-file ./babel.dist.config.json --out-dir dist src'.split(' '));
+runBabel();
 
-if (babelResult.status === 0) {
-  console.log(String(babelResult.stdout));
-} else {
-  console.log(String(babelResult.stderr));
-  process.exit(1);
+if (process.env.SOURCEMAP_COMMAND) {
+  console.log('running sourcemap generation...');
+  const cmdParts = process.env.SOURCEMAP_COMMAND.split(' ');
+  const tempSrcDir = path.resolve('src');
+  const sourcemapResult = childProcess.spawnSync(cmdParts[0], [cmdParts.slice(1).join(' ') + ` ${tempSrcDir} ${tempSrcDir} node_modules/@stackbit/components`], {
+    shell: true
+  });
+  console.log(String(sourcemapResult.stdout));
+  console.log(String(sourcemapResult.stderr));
+  runBabel('src', 'temp-dist');
+  // apply using: patch -p1 -i sourcemap.patch
+  childProcess.spawnSync('diff', ['-rc', 'dist temp-dist > dist/sourcemap.patch'], {
+    shell: true
+  });
+  childProcess.spawnSync('git', ['checkout', '--', 'src']);
+  fse.rmdirSync('temp-dist', { recursive: true });
 }
 
 console.log('copy package.json and remove peerDependencies marked as devDependencies...');

src/components/Action/index.js

@@ -1,3 +1,4 @@
+import React from 'react';
 import classNames from 'classnames';
 import Link from '../../utils/link';
 import ArrowRight from '../../svgs/arrow-right';

src/components/Badge/index.js

@@ -1,3 +1,5 @@
+import React from 'react';
+
 export default function Badge({ label, ...other }) {
     if (!label) {
         return null;

src/components/ContentSection/index.js

@@ -1,7 +1,7 @@
+import React from 'react';
 import Markdown from 'markdown-to-jsx';
 import classNames from 'classnames';
 import Badge from '../Badge';
-import React from 'react';
 import InlineMarkdown from '../InlineMarkdown';
 
 export default function ContentSection(props) {

src/components/CtaSection/index.js

@@ -1,8 +1,8 @@
+import React from 'react';
 import Markdown from 'markdown-to-jsx';
 import classNames from 'classnames';
 import Badge from '../Badge';
 import Action from '../Action';
-import React from 'react';
 import InlineMarkdown from '../InlineMarkdown';
 
 export default function CtaSection(props) {

src/components/FeaturedPostsSection/index.js

@@ -1,3 +1,4 @@
+import React from 'react';
 import classNames from 'classnames';
 import Link from 'next/link';
 import Badge from '../Badge';

src/components/Footer/index.js

@@ -1,3 +1,4 @@
+import React from 'react';
 import Markdown from 'markdown-to-jsx';
 import classNames from 'classnames';
 import Action from '../Action';

src/components/HeroSection/index.js

@@ -1,6 +1,7 @@
-import { getDynamicComponent } from '../../components-registry';
+import React from 'react';
 import Markdown from 'markdown-to-jsx';
 import classNames from 'classnames';
+import { getDynamicComponent } from '../../components-registry';
 import Badge from '../Badge';
 import Action from '../Action';
 import InlineMarkdown from '../InlineMarkdown';

src/components/ImageBlock/index.js

@@ -1,3 +1,5 @@
+import React from 'react';
+
 export default function ImageBlock(props) {
     const imageUrl = props.imageUrl;
     if (!imageUrl) {

src/components/NavBar/index.js

@@ -1,3 +1,4 @@
+import React from 'react';
 import { useState } from 'react';
 import classNames from 'classnames';
 import Action from '../Action';

src/components/VideoBlock/index.js

@@ -1,3 +1,5 @@
+import React from 'react';
+
 export default function VideoBlock(props) {
     const videoUrl = props.videoUrl;
     if (!videoUrl) {