From 534aceb1599c3c9924356b074d1cc329cc492c84 Mon Sep 17 00:00:00 2001 From: John Kreitlow Date: Thu, 11 Jun 2020 18:35:51 -0700 Subject: [PATCH] Add script to copy homepage into website dir --- sites/fast-website/src/public/index.html | 4 +- sites/fast-website/webpack.common.js | 18 ++-- sites/fast-website/webpack.prod.js | 6 +- sites/website/.gitignore | 6 +- sites/website/docusaurus.config.js | 9 +- sites/website/package.json | 14 +-- sites/website/src/build-homepage.js | 45 +++++++++ sites/website/src/pages/index.js | 114 ---------------------- sites/website/src/pages/styles.module.css | 36 ------- 9 files changed, 79 insertions(+), 173 deletions(-) create mode 100644 sites/website/src/build-homepage.js delete mode 100644 sites/website/src/pages/index.js delete mode 100644 sites/website/src/pages/styles.module.css diff --git a/sites/fast-website/src/public/index.html b/sites/fast-website/src/public/index.html index 6adb78ebf22..c9d0bf8fb9a 100644 --- a/sites/fast-website/src/public/index.html +++ b/sites/fast-website/src/public/index.html @@ -23,7 +23,7 @@ @@ -45,7 +45,7 @@ ADAPTIVE UI SYSTEM, UTILITIES, & TOOLS

The adaptive interface system for modern web experiences

Interfaces bult with FAST adapt to your design system and can be used with any modern UI Framework by leveraging industry standard Web Components.

- Get started + Get started diff --git a/sites/fast-website/webpack.common.js b/sites/fast-website/webpack.common.js index 85dfd479f6e..082394629c6 100644 --- a/sites/fast-website/webpack.common.js +++ b/sites/fast-website/webpack.common.js @@ -7,7 +7,6 @@ const MiniCssExtractPlugin = require("mini-css-extract-plugin"); const appDir = path.resolve(__dirname, "./src/app"); const publicDir = path.resolve(__dirname, "./src/public"); -const outDir = path.resolve(__dirname, "./www"); module.exports = { entry: { @@ -16,8 +15,8 @@ module.exports = { resolve: { extensions: [".svg", ".ts", ".tsx", ".js"], alias: { - svg: path.resolve(__dirname, "src/app/svg") - } + svg: path.resolve(__dirname, "src/app/svg"), + }, }, output: { path: path.resolve(__dirname, "dist"), @@ -59,19 +58,18 @@ module.exports = { { loader: "svg-inline-loader", options: { - removeSVGTagAttrs: false - } - } - ] - } + removeSVGTagAttrs: false, + }, + }, + ], + }, ], }, plugins: [ new CleanWebpackPlugin(), new HtmlWebpackPlugin({ - title: "FAST website", + title: "FAST", template: path.resolve(publicDir, "index.html"), - contentBase: outDir, }), ], }; diff --git a/sites/fast-website/webpack.prod.js b/sites/fast-website/webpack.prod.js index 70c076f8d35..dc9644e96eb 100644 --- a/sites/fast-website/webpack.prod.js +++ b/sites/fast-website/webpack.prod.js @@ -12,12 +12,12 @@ module.exports = merge(baseConfig, { minimizer: [new TerserJSPlugin({}), new OptimizeCSSAssetsPlugin({})], }, output: { - filename: "[name].[hash].js", + filename: "bundle/[name].[hash].js", }, plugins: [ new MiniCssExtractPlugin({ - filename: "[name].[hash].css", - chunkFilename: "[id].[hash].css", + filename: "bundle/[name].[hash].css", + chunkFilename: "bundle/[id].[hash].css", }), ], }); diff --git a/sites/website/.gitignore b/sites/website/.gitignore index 1bedc93706c..dec8c187401 100644 --- a/sites/website/.gitignore +++ b/sites/website/.gitignore @@ -22,4 +22,8 @@ yarn-debug.log* yarn-error.log* # Cache -.docusaurus \ No newline at end of file +.docusaurus + +# Static files from the homepage +static/bundle +static/index.html diff --git a/sites/website/docusaurus.config.js b/sites/website/docusaurus.config.js index 51093a95e3e..0886e3d6368 100644 --- a/sites/website/docusaurus.config.js +++ b/sites/website/docusaurus.config.js @@ -13,12 +13,19 @@ module.exports = { async: true, }, ], - themes: ["@docusaurus/theme-live-codeblock"], + themes: [require.resolve("@docusaurus/theme-live-codeblock")], themeConfig: { navbar: { logo: { alt: "FAST-DNA", src: "img/logo.svg", + + // FIXME: #3299 Docusaurus displays a blank page when clicking the logo link without workaround + target: "_blank", + ...(process.env.NODE_ENV === "production" && { + href: "https://www.fast.design", + target: "_self", + }), }, links: [ { diff --git a/sites/website/package.json b/sites/website/package.json index bbac2ec94ee..85364dd6ad2 100644 --- a/sites/website/package.json +++ b/sites/website/package.json @@ -4,15 +4,17 @@ "private": true, "scripts": { "clean": "node ../../build/clean.js docs", - "prepare-docs": "npm run clean && node src/prepare-docs.js", - "dev": "npm run prepare-docs && docusaurus start", - "build": "npm run prepare-docs && docusaurus build" + "prepare-docs": "yarn clean && node src/prepare-docs.js", + "build-homepage": "node src/build-homepage.js", + "dev": "yarn build-homepage && yarn prepare-docs && docusaurus start", + "build": "yarn build-homepage && yarn prepare-docs && docusaurus build" }, "dependencies": { - "@docusaurus/core": "2.0.0-alpha.48", - "@docusaurus/preset-classic": "2.0.0-alpha.48", - "@docusaurus/theme-live-codeblock": "2.0.0-alpha.39", + "@docusaurus/core": "2.0.0-alpha.56", + "@docusaurus/preset-classic": "2.0.0-alpha.56", + "@docusaurus/theme-live-codeblock": "2.0.0-alpha.56", "classnames": "^2.2.6", + "copyfiles": "^2.3.0", "react": "^16.8.4", "react-dom": "^16.8.4" }, diff --git a/sites/website/src/build-homepage.js b/sites/website/src/build-homepage.js new file mode 100644 index 00000000000..0b22ad47ee2 --- /dev/null +++ b/sites/website/src/build-homepage.js @@ -0,0 +1,45 @@ +// FIXME: #3298 Merge fast-website and website projects to replace temporary build/copy script + +/* eslint-env node */ +/* eslint-disable @typescript-eslint/typedef */ +/* eslint-disable @typescript-eslint/no-var-requires */ +/* eslint-disable @typescript-eslint/explicit-function-return-type */ +const { spawn } = require("child_process"); +const path = require("path"); +const copyfiles = require("copyfiles"); + +const projectPath = path.resolve(__dirname, "../../fast-website"); +const staticPath = path.resolve(__dirname, "../static"); +const indexPath = path.resolve(projectPath, "dist/index.html"); + +const copyConfig = { flat: true, verbose: true, up: true }; + +function copyBundle() { + copyfiles([indexPath, staticPath], copyConfig, () => { + console.log("Copied homepage files to static"); + }); + + copyfiles( + [`${projectPath}/dist/bundle/*`, `${staticPath}/bundle`], + copyConfig, + () => { + console.log("Copied homepage files to static"); + } + ); +} + +// Run `yarn build` in the fast-website project +const yarnBuild = spawn("yarn", ["build"], { cwd: projectPath }); + +yarnBuild.stdout.on("data", data => console.log(`stdout: ${data}`)); +yarnBuild.stderr.on("data", data => console.log(`stderr: ${data}`)); +yarnBuild.on("error", error => console.log(`error: ${error.message}`)); + +yarnBuild.on("close", exitCode => { + console.log(`child process exited with code ${exitCode}`); + if (exitCode !== 0) { + process.exit(exitCode); + } + + copyBundle(); +}); diff --git a/sites/website/src/pages/index.js b/sites/website/src/pages/index.js deleted file mode 100644 index 7f30954b513..00000000000 --- a/sites/website/src/pages/index.js +++ /dev/null @@ -1,114 +0,0 @@ -import React from "react"; -import classnames from "classnames"; -import Layout from "@theme/Layout"; -import Link from "@docusaurus/Link"; -import useDocusaurusContext from "@docusaurus/useDocusaurusContext"; -import useBaseUrl from "@docusaurus/useBaseUrl"; -import styles from "./styles.module.css"; - -const features = [ - { - title: <>Easy to Use, - imageUrl: "img/undraw_docusaurus_mountain.svg", - description: ( - <> - Docusaurus was designed from the ground up to be easily installed and used - to get your website up and running quickly. - - ), - }, - { - title: <>Focus on What Matters, - imageUrl: "img/undraw_docusaurus_tree.svg", - description: ( - <> - Docusaurus lets you focus on your docs, and we'll do the chores. Go - ahead and move your docs into the docs directory. - - ), - }, - { - title: <>Powered by React, - imageUrl: "img/undraw_docusaurus_react.svg", - description: ( - <> - Extend or customize your website layout by reusing React. Docusaurus can - be extended while reusing the same header and footer. - - ), - }, -]; - -function Feature({ imageUrl, title, description }) { - const imgUrl = useBaseUrl(imageUrl); - return ( -
- {imgUrl && ( -
- {title} -
- )} -

{title}

-

{description}

-
- ); -} - -function Home() { - const context = useDocusaurusContext(); - const { siteConfig = {} } = context; - return ( - -
-
-

{siteConfig.title}

-

{siteConfig.tagline}

-
- - Get Started - -
-
-
-
- {features && features.length && ( -
-
-
- {features.map((props, idx) => ( - - ))} -
-
-
- )} -
- - ); -} - -function CustomHome() { - return ( - - - FAST-DNA - - -

FAST-DNA

-

Custom home page content goes here...

- Docs - - - ); -} - -export default CustomHome; diff --git a/sites/website/src/pages/styles.module.css b/sites/website/src/pages/styles.module.css deleted file mode 100644 index 34f21992a2b..00000000000 --- a/sites/website/src/pages/styles.module.css +++ /dev/null @@ -1,36 +0,0 @@ -/* stylelint-disable docusaurus/copyright-header */ -/** - * CSS files with the .module.css suffix will be treated as CSS modules - * and scoped locally. - */ - -.heroBanner { - padding: 4rem 0; - text-align: center; - position: relative; - overflow: hidden; -} - -@media screen and (max-width: 966px) { - .heroBanner { - padding: 2rem; - } -} - -.buttons { - display: flex; - align-items: center; - justify-content: center; -} - -.features { - display: flex; - align-items: center; - padding: 2rem 0; - width: 100%; -} - -.featureImage { - height: 200px; - width: 200px; -}