From d844308e32f8572de174a543da3315894615ee69 Mon Sep 17 00:00:00 2001 From: dannyrb Date: Tue, 30 Apr 2019 00:03:47 -0400 Subject: [PATCH 1/5] Add test for utils folder grouped exports --- src/utils/index.test.js | 11 +++++++++++ 1 file changed, 11 insertions(+) create mode 100644 src/utils/index.test.js diff --git a/src/utils/index.test.js b/src/utils/index.test.js new file mode 100644 index 000000000..78174122a --- /dev/null +++ b/src/utils/index.test.js @@ -0,0 +1,11 @@ +import * as utils from './index.js' + +describe('utils', () => { + it('has the expected exports', () => { + const utilExports = Object.keys(utils).sort() + + expect(utilExports).toEqual( + ['getUserManagerForOpenIdConnectClient', 'initWebWorkers'].sort() + ) + }) +}) From 8e4b0ac737daf2ff607cbd284bdd396015fc6f82 Mon Sep 17 00:00:00 2001 From: dannyrb Date: Tue, 30 Apr 2019 09:52:51 -0400 Subject: [PATCH 2/5] Merge build and restore sections --- README-react.md | 32 ----------- docs/latest/SUMMARY.md | 3 +- .../recipes/build-for-production.md | 56 +++++++++++++------ 3 files changed, 40 insertions(+), 51 deletions(-) delete mode 100644 README-react.md diff --git a/README-react.md b/README-react.md deleted file mode 100644 index 9f4a1a5b8..000000000 --- a/README-react.md +++ /dev/null @@ -1,32 +0,0 @@ -# OHIF Viewer (React Version) - -Disclaimer: Work in Progress - -## To run locally - -1. `yarn install` -1. `yarn start` -1. `Go to http://localhost:5000` - -To user another DICOMWeb endpoint, adapt index.js - -## To include in your projects - -Please refer to the example in the example directory. To set the DICOMWeb -endpoint and do other customization, adapt index.html. - -### Build - -1. `yarn install` -1. `yarn build` - -### Run the example - -1. `cd example` -1. `yarn install` -1. `yarn start` -1. `Go to http://localhost:5000` - -## License - -MIT © [OHIF](https://github.com/OHIF) diff --git a/docs/latest/SUMMARY.md b/docs/latest/SUMMARY.md index 54581e9e8..89503f61e 100644 --- a/docs/latest/SUMMARY.md +++ b/docs/latest/SUMMARY.md @@ -36,7 +36,8 @@ - [Stand-alone](deployment/index.md#stand-alone-viewer) - [Data]() - Recipes - - [Embedding the Viewer](deployment/recipes/embedded-viewer.md)) + - [Embedding the Viewer](deployment/recipes/embedded-viewer.md) + - [Build for Production](deployment/recipes/build-for-production.md) - [PWA: Static]() - [PWA: Docker]() - [PWA: Nginx + Orthanc]() diff --git a/docs/latest/deployment/recipes/build-for-production.md b/docs/latest/deployment/recipes/build-for-production.md index 74ee3b552..3a0cea540 100644 --- a/docs/latest/deployment/recipes/build-for-production.md +++ b/docs/latest/deployment/recipes/build-for-production.md @@ -1,6 +1,8 @@ # Build for Production -Note about setting up for contributing, then skip X +> If you've already followed the +> ["Getting Started" Guide](/essentials/getting-started.md), you can skip ahead +> to [Configuration](#configuration) ## Overview? @@ -10,11 +12,11 @@ Note about setting up for contributing, then skip X - [Yarn](https://yarnpkg.com/lang/en/docs/install/) - [Git](https://www.atlassian.com/git/tutorials/install-git) -### Get a Copy of the source +### Getting the Code _With Git:_ -```shell +```bash # Clone the remote repository to your local machine git clone https://github.com/OHIF/Viewers.git @@ -29,11 +31,35 @@ _From .zip:_ [OHIF/Viewers: react.zip](https://github.com/OHIF/Viewers/archive/react.zip) -### Restore Dependencies? +### Restore Dependencies & Build -... +Open PowerShell, Terminal, or a Command Prompt, and navigate to the directory +containing the source files. Next run these commands: -### Configure? +```js +// Restore dependencies +yarn install + +// Build source code for production +yarn run build:web +``` + +If everything worked as expected, you should have a new `build/` directory in +the project's folder. It should roughly resemble the following: + +```bash +build +├── config/ +├── static/ +├── index.html +├── manifest.json +├── service-worker.js +└── ... +``` + +These files can be hosted using + +### Configuration ... @@ -41,18 +67,6 @@ _From .zip:_ - `REACT_APP_*` - config file(s) -### Build - -From your projects - -```js -yarn run build:web -``` - -```js -file tree of project, highlighting contents in `/buld` -``` - ## Next Steps ### Deploying our Production Build @@ -71,6 +85,12 @@ web application. For a starting point, check out this repository's own use of: [generateStaticSite.sh][generatestaticsite.sh] - [Semantic-Release][semantic-release]: [.releaserc][releaserc] +## Troubleshooting + +> Issues and resolutions for common GitHub issues will be summarized here + +... + [circleci]: https://circleci.com/gh/OHIF/Viewers [circleci-config]: https://github.com/OHIF/Viewers/blob/react/.circleci/config.yml From b5cac7191db45cedee561ceb5d0929ca23eb1c31 Mon Sep 17 00:00:00 2001 From: dannyrb Date: Tue, 30 Apr 2019 10:08:10 -0400 Subject: [PATCH 3/5] add .js to app config --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 6940bcce8..68929a2ae 100644 --- a/package.json +++ b/package.json @@ -18,7 +18,7 @@ "dev": "yarn run preBuild && cross-env PORT=5000 react-scripts start", "dev:debug": "cross-env PORT=5000 react-scripts start", "build:package": "yarn run preBuild && node --max-old-space-size=4096 node_modules/rollup/bin/rollup -c", - "build:package:ci": "yarn run preBuild && cross-env REACT_APP_CONFIG=config/default node --max-old-space-size=4096 node_modules/rollup/bin/rollup -c", + "build:package:ci": "yarn run preBuild && cross-env REACT_APP_CONFIG=config/default.js node --max-old-space-size=4096 node_modules/rollup/bin/rollup -c", "build:web": "yarn run preBuild && react-scripts --max_old_space_size=4096 build", "build:web:ci": "yarn run preBuild && react-scripts --max_old_space_size=4096 build && cpx 'build/**/*' docs/latest/_book/demo --verbose", "lint": "eslint -c .eslintrc --fix src && prettier --single-quote --write src/**/*.{js,jsx,json,css}", From 0909ab7c536285194ef67edb418fae53defe4cc7 Mon Sep 17 00:00:00 2001 From: dannyrb Date: Tue, 30 Apr 2019 10:39:24 -0400 Subject: [PATCH 4/5] Transition to configuration --- docs/latest/SUMMARY.md | 18 ++++++++------- .../recipes/build-for-production.md | 22 +++++++++++++++++-- 2 files changed, 30 insertions(+), 10 deletions(-) diff --git a/docs/latest/SUMMARY.md b/docs/latest/SUMMARY.md index 89503f61e..b483ba885 100644 --- a/docs/latest/SUMMARY.md +++ b/docs/latest/SUMMARY.md @@ -36,14 +36,16 @@ - [Stand-alone](deployment/index.md#stand-alone-viewer) - [Data]() - Recipes - - [Embedding the Viewer](deployment/recipes/embedded-viewer.md) - - [Build for Production](deployment/recipes/build-for-production.md) - - [PWA: Static]() - - [PWA: Docker]() - - [PWA: Nginx + Orthanc]() - - [PWA: Nginx + dcm4chee]() - - [PWA: Nginx + DICOMCloud]() - - [PWA: User Access Control]() + - Script Include + - [Embedding the Viewer](deployment/recipes/embedded-viewer.md) + - Stand-Alone + - [Build for Production](deployment/recipes/build-for-production.md) + - [Static]() + - [Docker]() + - [Nginx + Orthanc]() + - [Nginx + dcm4chee]() + - [Nginx + DICOMCloud]() + - [User Access Control]() --- diff --git a/docs/latest/deployment/recipes/build-for-production.md b/docs/latest/deployment/recipes/build-for-production.md index 3a0cea540..c8a19246c 100644 --- a/docs/latest/deployment/recipes/build-for-production.md +++ b/docs/latest/deployment/recipes/build-for-production.md @@ -4,7 +4,7 @@ > ["Getting Started" Guide](/essentials/getting-started.md), you can skip ahead > to [Configuration](#configuration) -## Overview? +## Overview ### Build Machine Requirements @@ -57,7 +57,10 @@ build └── ... ``` -These files can be hosted using +By default, the build output will connect to OHIF's publicly accessible PACS. If +this is your first time setting up the OHIF Viewer, it is recommended that you +test with these default settings. After testing, you can find instructions on +how to configure the project for your own imaging archive below. ### Configuration @@ -73,6 +76,21 @@ These files can be hosted using TODO: List of recipes +### Testing Build Output Locally + +A quick way to test your build output locally is to spin up a small webserver. +You can do this by running the following commands in the `build/` output +directory: + +```js +// Install http-server as a globally available package +yarn global add http-server + +// Serve the files in our current directory +// Accessible at: `http://localhost:8080` +http-server +``` + ### Automating Builds and Deployments If you found setting up your environmnent and running all of these steps to be a From 33d06dba4e072a444b766fd382f241be376c1516 Mon Sep 17 00:00:00 2001 From: dannyrb Date: Tue, 30 Apr 2019 11:56:13 -0400 Subject: [PATCH 5/5] how it works --- docs/latest/deployment/index.md | 2 +- .../recipes/build-for-production.md | 38 ++++++++++++++++--- 2 files changed, 33 insertions(+), 7 deletions(-) diff --git a/docs/latest/deployment/index.md b/docs/latest/deployment/index.md index 178322173..88e2a265b 100644 --- a/docs/latest/deployment/index.md +++ b/docs/latest/deployment/index.md @@ -62,7 +62,7 @@ deployment experience. "Building", or creating, the files you will need is the same regardless of the web host you choose. You can find detailed instructions on how to configure and build the OHIF Viewer in our -["Build for Production" guide](./build-for-production.md). +["Build for Production" guide](./recipes/build-for-production.md). ##### Part 2 - Host Your App diff --git a/docs/latest/deployment/recipes/build-for-production.md b/docs/latest/deployment/recipes/build-for-production.md index c8a19246c..6ab01c731 100644 --- a/docs/latest/deployment/recipes/build-for-production.md +++ b/docs/latest/deployment/recipes/build-for-production.md @@ -33,8 +33,8 @@ _From .zip:_ ### Restore Dependencies & Build -Open PowerShell, Terminal, or a Command Prompt, and navigate to the directory -containing the source files. Next run these commands: +Open your terminal, and navigate to the directory containing the source files. +Next run these commands: ```js // Restore dependencies @@ -64,11 +64,37 @@ how to configure the project for your own imaging archive below. ### Configuration -... +> This step assumes you have an imaging archive. If you need assistance setting +> one up, check out the [`Data` section](./../index.md#data) of our Deployment +> Guide, or `Getting Started`'s +> ["Set up a local DICOM server"](./../../essentials/getting-started.md#set-up-a-local-dicom-server), +> or a deployment recipe that contains an open source Image Archive -- env vars -- `REACT_APP_*` -- config file(s) +#### How It Works + +The configuration for our project is in the `/public/config` directory. Our +build process knows which configuration file to use based on the +`REACT_APP_CONFIG` environment variable. By default, its value is +[`default.js`](https://github.com/OHIF/Viewers/blob/react/public/config/default.js). +When we build, the `%REACT_APP_CONFIG%` value in +our[`/public/index.html`](https://github.com/OHIF/Viewers/blob/react/public/index.html#L12-L15)`file is substituted for the correct configuration file's name. Ultimately setting the`window.config` +equal to our configuration file's value. + +- Modify its values directly +- Create a new config file, and set the `REACT_APP_CONFIG` environement variable +- + +The build process knows which file to use based on the `REACT_APP_CONFIG` +environment variable. You can set the value of this environment variable a few +different ways: + +- [Add a temporary environment variable in your shell](https://facebook.github.io/create-react-app/docs/adding-custom-environment-variables#adding-temporary-environment-variables-in-your-shell) +- [Add environment specific variables in `.env` file(s)](https://facebook.github.io/create-react-app/docs/adding-custom-environment-variables#adding-development-environment-variables-in-env) +- + +* env vars +* `REACT_APP_*` +* config file(s) ## Next Steps