{"type":"doc","content":[{"type":"layoutSection","content":[{"type":"layoutColumn","attrs":{"width":33.33},"content":[{"type":"paragraph","content":[{"text":"Table of Contents","type":"text","marks":[{"type":"strong"}]}]},{"type":"extension","attrs":{"layout":"default","extensionType":"com.atlassian.confluence.macro.core","extensionKey":"toc","parameters":{"macroParams":{"minLevel":{"value":"2"},"maxLevel":{"value":"2"},"outline":{"value":"false"},"style":{"value":"disc"},"type":{"value":"list"},"printable":{"value":"true"}},"macroMetadata":{"macroId":{"value":"61238332-bf9b-4488-b70b-6e3bac86513a"},"schemaVersion":{"value":"1"},"title":"Table of Contents"}},"localId":"c4d3f7d6-82a9-4778-af33-6fd7dc6cffa8"}}]},{"type":"layoutColumn","attrs":{"width":66.66},"content":[{"type":"blockquote","content":[{"type":"paragraph","content":[{"text":"About UI Layer","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"This layer runs in a web browser, and is what your users will see on their screens when working with CollectionSpace.","type":"text"}]},{"type":"paragraph","content":[{"text":"The CollectionSpace JS projects are written in JavaScript (JS).","type":"text"}]},{"type":"paragraph","content":[{"text":"This document provides an overview of the languages, tools, and libraries used in CollectionSpace JS development.","type":"text"}]}]},{"type":"paragraph","content":[{"text":" ","type":"text"}]}]}]},{"type":"rule"},{"type":"heading","attrs":{"level":2},"content":[{"text":"JavaScript","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"Language ","type":"text"},{"text":"features","type":"text","marks":[{"type":"link","attrs":{"href":"https://babeljs.io/docs/learn-es2015"}}]},{"text":" of JavaScript ","type":"text"},{"text":"ES2015","type":"text","marks":[{"type":"link","attrs":{"href":"http://www.ecma-international.org/ecma-262/6.0"}}]},{"text":" (also known as ES6), ","type":"text"},{"text":"ES2016","type":"text","marks":[{"type":"link","attrs":{"href":"http://www.ecma-international.org/ecma-262/7.0/"}}]},{"text":", and ","type":"text"},{"text":"ES2017","type":"text","marks":[{"type":"link","attrs":{"href":"http://www.ecma-international.org/ecma-262/8.0/"}}]},{"text":" are used throughout. Support for the latest JavaScript features is inconsistent among browsers. Cross-browser compatibility is achieved by compiling to the lowest-common-denominator among the supported browsers at build-time, using ","type":"text"},{"text":"Babel","type":"text","marks":[{"type":"link","attrs":{"href":"https://collectionspace.atlassian.net/wiki/spaces/DOC/pages/2930128768#OverviewofLanguages,Tools,andLibraries-Babel"}}]},{"text":" and the ","type":"text"},{"text":"Babel Env preset","type":"text","marks":[{"type":"link","attrs":{"href":"https://babeljs.io/docs/plugins/preset-env/"}}]},{"text":".","type":"text"}]},{"type":"paragraph","content":[{"text":"One unstandardized language feature, currently a ","type":"text"},{"text":"Stage 4 (Finished) proposal","type":"text","marks":[{"type":"link","attrs":{"href":"https://tc39.github.io/process-document"}}]},{"text":", is also used: ","type":"text"},{"text":"Object Rest/Spread","type":"text","marks":[{"type":"link","attrs":{"href":"https://github.com/sebmarkbage/ecmascript-rest-spread"}}]},{"text":".","type":"text"}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Development Tools and Libraries","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"The following tools and libraries are used for development.","type":"text"}]},{"type":"table","attrs":{"layout":"default","width":760.0,"localId":"47ba1dac-950f-464c-935f-d0848b00dafa"},"content":[{"type":"tableRow","content":[{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":[149.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Tools/Libraries","type":"text"}]}]},{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":[610.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Description","type":"text"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[149.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Node.js","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[610.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Node.js","type":"text","marks":[{"type":"link","attrs":{"href":"https://nodejs.org/"}}]},{"text":" provides a JavaScript interpreter and libraries to run JS programs outside of a web browser. It is required to run the other development tools, all of which are JS programs. Version 8 is recommended.","type":"text"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[149.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"npm","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[610.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"npm","type":"text","marks":[{"type":"link","attrs":{"href":"https://www.npmjs.com/"}}]},{"text":" is a package manager for JavaScript. Its primary purpose is to download and keep up-to-date the external libraries used by a project. It also provides some simple build management capabilities.","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"CollectionSpace JS projects are distributed as npm packages. The source code for each project contains a top-level ","type":"text"},{"text":"package.json","type":"text","marks":[{"type":"code"}]},{"text":" file. This file contains package metadata, including version numbers of development and runtime dependencies, and scripts to perform development tasks such as linting, compiling, and testing. Since npm acts as the entry point, it's usually the only build tool you need to know. The other build tools normally do not need to be invoked directly.","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"To begin work on a project, clone it from GitHub, then run ","type":"text"},{"text":"npm install","type":"text","marks":[{"type":"code"}]},{"text":". This downloads the project's dependencies, and installs them in the ","type":"text"},{"text":"node_modules","type":"text","marks":[{"type":"code"}]},{"text":" directory:","type":"text"}]},{"type":"extension","attrs":{"extensionType":"com.atlassian.confluence.migration","extensionKey":"nested-table","text":"","parameters":{"cxhtml":"

`$ git clone https://github.com/collectionspace/cspace-ui.js.git`

`$ cd cspace-ui.js`

`$ npm install`

","nestedContent":{"type":"doc","content":[{"type":"table","attrs":{"layout":"default","localId":"466eb8c9-2e8c-4cb6-9c4b-7ec2ab984cbd"},"content":[{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"background":"initial","rowspan":1},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"$ git clone https://github.com/collectionspace/cspace-ui.js.git","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"$ cd cspace-ui.js","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"$ npm install","type":"text","marks":[{"type":"code"}]}]}]}]}]}],"version":1},"adf":"{\"type\":\"doc\",\"content\":[{\"type\":\"table\",\"attrs\":{\"layout\":\"default\",\"localId\":\"466eb8c9-2e8c-4cb6-9c4b-7ec2ab984cbd\"},\"content\":[{\"type\":\"tableRow\",\"content\":[{\"type\":\"tableCell\",\"attrs\":{\"colspan\":1,\"background\":\"initial\",\"rowspan\":1},\"content\":[{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\"$ git clone https://github.com/collectionspace/cspace-ui.js.git\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\"$ cd cspace-ui.js\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\"$ npm install\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]}]}]}]}],\"version\":1}","reason":"A table in a table cell can't be created or edited in the new editor."}}},{"type":"heading","attrs":{"level":6},"content":[{"text":"To see the available scripts in a project, execute ","type":"text"},{"text":"npm run","type":"text","marks":[{"type":"code"}]},{"text":" with no arguments:","type":"text"}]},{"type":"extension","attrs":{"extensionType":"com.atlassian.confluence.migration","extensionKey":"nested-table","text":"","parameters":{"cxhtml":"

`$ npm run`

`Lifecycle scripts included in cspace-ui:`

`prepublish`

`...`

`start`

`...`

`test`

`...`

available via `npm run-script`:

`build`

`...`

`build-cjs`

`...`

`build-umd`

`...`

`build-umd-dev`

`...`

`build-umd-prod`

`...`

`check`

`...`

`clean`

`...`

","nestedContent":{"type":"doc","content":[{"type":"table","attrs":{"layout":"default","localId":"3714b33f-004e-41ee-8eb0-6f9633e0d0a1"},"content":[{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"background":"initial","rowspan":1},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"$ npm run","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"Lifecycle scripts included in cspace-ui:","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":" prepublish","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":" ...","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":" start","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":" ...","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":" test","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":" ...","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"available via `npm run-script`:","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":" build","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":" ...","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":" build-cjs","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":" ...","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":" build-umd","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":" ...","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":" build-umd-dev","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":" ...","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":" build-umd-prod","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":" ...","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":" check","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":" ...","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":" clean","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":" ...","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":" ...","type":"text","marks":[{"type":"code"}]}]}]}]}]}],"version":1},"adf":"{\"type\":\"doc\",\"content\":[{\"type\":\"table\",\"attrs\":{\"layout\":\"default\",\"localId\":\"3714b33f-004e-41ee-8eb0-6f9633e0d0a1\"},\"content\":[{\"type\":\"tableRow\",\"content\":[{\"type\":\"tableCell\",\"attrs\":{\"colspan\":1,\"background\":\"initial\",\"rowspan\":1},\"content\":[{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\"$ npm run\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\"Lifecycle scripts included in cspace-ui:\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\" prepublish\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\" ...\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\" start\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\" ...\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\" test\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\" ...\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\"available via `npm run-script`:\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\" build\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\" ...\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\" build-cjs\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\" ...\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\" build-umd\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\" ...\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\" build-umd-dev\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\" ...\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\" build-umd-prod\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\" ...\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\" check\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\" ...\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\" clean\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\" ...\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\" ...\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]}]}]}]}],\"version\":1}","reason":"A table in a table cell can't be created or edited in the new editor."}}},{"type":"heading","attrs":{"level":6},"content":[{"text":"To run a script, execute ","type":"text"},{"text":"npm run","type":"text","marks":[{"type":"code"}]},{"text":" followed by the name of the script:","type":"text"}]},{"type":"extension","attrs":{"extensionType":"com.atlassian.confluence.migration","extensionKey":"nested-table","text":"","parameters":{"cxhtml":"

`$ npm run clean`

`...`

","nestedContent":{"type":"doc","content":[{"type":"table","attrs":{"layout":"default","localId":"c2e12fb1-feea-4d13-83b8-2f4357909dbf"},"content":[{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"background":"initial","rowspan":1},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"$ npm run clean","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"...","type":"text","marks":[{"type":"code"}]}]}]}]}]}],"version":1},"adf":"{\"type\":\"doc\",\"content\":[{\"type\":\"table\",\"attrs\":{\"layout\":\"default\",\"localId\":\"c2e12fb1-feea-4d13-83b8-2f4357909dbf\"},\"content\":[{\"type\":\"tableRow\",\"content\":[{\"type\":\"tableCell\",\"attrs\":{\"colspan\":1,\"background\":\"initial\",\"rowspan\":1},\"content\":[{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\"$ npm run clean\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\"...\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]}]}]}]}],\"version\":1}","reason":"A table in a table cell can't be created or edited in the new editor."}}},{"type":"heading","attrs":{"level":6},"content":[{"text":"Some scripts are part of npm's ","type":"text"},{"text":"standard lifecycle","type":"text","marks":[{"type":"link","attrs":{"href":"https://docs.npmjs.com/misc/scripts"}}]},{"text":". For these, the ","type":"text"},{"text":"run","type":"text","marks":[{"type":"code"}]},{"text":" part of the command may be omitted:","type":"text"}]},{"type":"extension","attrs":{"extensionType":"com.atlassian.confluence.migration","extensionKey":"nested-table","text":"","parameters":{"cxhtml":"

`$ npm test`

`...`

","nestedContent":{"type":"doc","content":[{"type":"table","attrs":{"layout":"default","localId":"07ff80ff-0f13-4fa8-bd94-86e467928fa0"},"content":[{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"background":"initial","rowspan":1},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"$ npm test","type":"text","marks":[{"type":"code"}]}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"...","type":"text","marks":[{"type":"code"}]}]}]}]}]}],"version":1},"adf":"{\"type\":\"doc\",\"content\":[{\"type\":\"table\",\"attrs\":{\"layout\":\"default\",\"localId\":\"07ff80ff-0f13-4fa8-bd94-86e467928fa0\"},\"content\":[{\"type\":\"tableRow\",\"content\":[{\"type\":\"tableCell\",\"attrs\":{\"colspan\":1,\"background\":\"initial\",\"rowspan\":1},\"content\":[{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\"$ npm test\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]},{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\"...\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]}]}]}]}],\"version\":1}","reason":"A table in a table cell can't be created or edited in the new editor."}}},{"type":"heading","attrs":{"level":6},"content":[{"text":"Important npm scripts common to all CollectionSpace JS projects include:","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"lint","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"},{"text":"npm run lint","type":"text","marks":[{"type":"code"}]},{"text":" will check the source code against linting rules. See ESLint.","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"test","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"},{"text":"npm run test","type":"text","marks":[{"type":"code"}]},{"text":" or ","type":"text"},{"text":"npm test","type":"text","marks":[{"type":"code"}]},{"text":" will run tests once. See Karma and nyc. ","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"start","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"},{"text":"npm run start","type":"text","marks":[{"type":"code"}]},{"text":" or ","type":"text"},{"text":"npm start","type":"text","marks":[{"type":"code"}]},{"text":" will run tests continuously. See Karma. ","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"coverage","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"},{"text":"npm run coverage","type":"text","marks":[{"type":"code"}]},{"text":" will generate test coverage reports. See Karma, nyc and Istanbul. ","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"check","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"},{"text":"npm run check","type":"text","marks":[{"type":"code"}]},{"text":" will run ","type":"text"},{"text":"lint","type":"text","marks":[{"type":"code"}]},{"text":", ","type":"text"},{"text":"test","type":"text","marks":[{"type":"code"}]},{"text":", and ","type":"text"},{"text":"coverage","type":"text","marks":[{"type":"code"}]},{"text":". A pull request must pass ","type":"text"},{"text":"check","type":"text","marks":[{"type":"code"}]},{"text":" in order to be accepted.","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"build","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"},{"text":"npm run build","type":"text","marks":[{"type":"code"}]},{"text":" will generate JavaScript bundles for distribution (a development bundle and a minified production bundle). See webpack.","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"clean","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"},{"text":"npm run clean","type":"text","marks":[{"type":"code"}]},{"text":" will delete all files generated by development scripts, including distribution bundles and coverage data.","type":"text"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[149.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Babel","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[610.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Babel","type":"text","marks":[{"type":"link","attrs":{"href":"https://babeljs.io/"}}]},{"text":" is a JavaScript-to-JavaScript compiler. It is used to compile newer versions of JavaScript down to an older version that works in a wider range of browsers. Even as browser support for the latest version of JS advances, Babel will continue to provide value; language features of the ","type":"text"},{"text":"next","type":"text","marks":[{"type":"em"}]},{"text":" version of JavaScript may be used in advance of full compatibility across browsers. Additionally, Babel provides a place to plug in other useful static analysis and transformation tools. These include:","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"JSX transformation","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"},{"text":"Compile JSX to JS. JSX is an optional XML format for describing React components. React components may be defined directly in JavaScript, but JSX is usually more readable. In CollectionSpace source code, React components are always defined in JSX.","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"Dev expression removal","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"},{"text":"Strip certain development-only code from production builds. This is used to enable printing of verbose warning messages when running in development, without impacting the size or performance of the production build.","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"Test coverage instrumentation","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"},{"text":"Modify the source code to track the number of times each function, line, and branch are executed. When combined with a compatible test runner and report generator, this makes it easy to spot the parts of the codebase that are insufficiently tested.","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"i18n message extraction","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"},{"text":"Generate JSON message definition files. Translatable messages in the CollectionSpace UI are defined inside the source files where they're used. This is convenient for developers, but inconvenient for translators. This finds and extracts the message definitions from the source code, so that files containing only message definitions may be provided to translators.","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"Babel is configured into various other tools, and never needs to be invoked directly. Many of the npm scripts in CollectionSpace JS projects will invoke Babel in some way.","type":"text"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[149.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"webpack","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[610.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"webpack","type":"text","marks":[{"type":"link","attrs":{"href":"https://webpack.github.io/"}}]},{"text":" is a JavaScript module bundler. It takes source files in a project, including JS files and their dependencies, CSS files, and small images, and generates a single JS file for distribution. This serves two purposes:","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"> Reduce the number of HTTP requests a browser needs to make to bootstrap an application.","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"> Remove the possibility that a browser may have cached some files from an older version of the application that are incompatible with files from the current version. All of the assets for any version of the application may be bundled together as a unit, and only that unit may be cached.","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"webpack is configured into various other tools, and never needs to be invoked directly. Several of the npm scripts in CollectionSpace JS projects will invoke webpack, the main one being ","type":"text"},{"text":"build","type":"text","marks":[{"type":"code"}]},{"text":". ","type":"text"},{"text":"npm run build","type":"text","marks":[{"type":"code"}]},{"text":" generates two bundles in the top-level ","type":"text"},{"text":"dist","type":"text","marks":[{"type":"code"}]},{"text":" directory: a development bundle, and a minified production bundle.","type":"text"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[149.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Karma","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[610.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Karma","type":"text","marks":[{"type":"link","attrs":{"href":"https://karma-runner.github.io/"}}]},{"text":" is a JavaScript test runner. Running tests requires a lot of steps: the test code must be bundled with the code being tested and all of its dependencies; a browser must be started; a server must be started; the browser must make a request to the server, and be served the test bundle to run; the browser must run the tests; the browser must report the results back to the server, which can then output a report; and the browser must be closed. Karma handles all of this, and can start multiple browsers, run the tests in all of them, and aggregate their results. By default, only Chrome is used on a local test run. A full suite of browsers is used on a CI server test run.","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"The test bundles generated by Karma are configured to be instrumented for coverage reporting, and Karma is configured to output raw coverage data to the top-level ","type":"text"},{"text":"coverage","type":"text","marks":[{"type":"code"}]},{"text":" directory. The ","type":"text"},{"text":"coverage","type":"text","marks":[{"type":"code"}]},{"text":" directory will contain a subdirectory for each browser in which tests are run. ","type":"text"},{"text":"Istanbul","type":"text","marks":[{"type":"link","attrs":{"href":"https://collectionspace.atlassian.net/wiki/spaces/DOC/pages/2930128768#OverviewofLanguages,Tools,andLibraries-Istanbul"}}]},{"text":" may be used to generate reports from this raw data.","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"Karma generally never needs to be invoked directly. A few of the npm scripts in CollectionSpace JS projects will invoke Karma, the main ones being ","type":"text"},{"text":"test","type":"text","marks":[{"type":"code"}]},{"text":" and ","type":"text"},{"text":"start","type":"text","marks":[{"type":"code"}]},{"text":". ","type":"text"},{"text":"npm [run] test","type":"text","marks":[{"type":"code"}]},{"text":" will run tests once, opening and closing a browser, and reporting the results. ","type":"text"},{"text":"npm [run] start","type":"text","marks":[{"type":"code"}]},{"text":" will start Karma in continuous mode. In this mode, a browser will be opened, and tests will be run once; then the browser will remain open, and as source files are edited and saved, the changes will be detected, and the tests will automatically be rerun. During development you'll usually want to keep terminal and browser windows open off to the side, continuously running tests.","type":"text"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[149.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"ESLint","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[610.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"ESLint","type":"text","marks":[{"type":"link","attrs":{"href":"http://eslint.org/"}}]},{"text":" is a JavaScript code linter. It is used to catch potential errors and to enforce style. The linting rules used by CollectionSpace JS projects are ","type":"text"},{"text":"sourced from Airbnb","type":"text","marks":[{"type":"link","attrs":{"href":"https://www.npmjs.com/package/eslint-config-airbnb"}}]},{"text":", mainly because they are a reasonable set of rules that are maintained by people who are not us. The ","type":"text"},{"text":"Airbnb style guide","type":"text","marks":[{"type":"link","attrs":{"href":"https://github.com/airbnb/javascript"}}]},{"text":" should be followed, even where it is not enforced by linting rules.","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"ESLint never needs to be invoked directly. The npm ","type":"text"},{"text":"lint","type":"text","marks":[{"type":"code"}]},{"text":" and ","type":"text"},{"text":"check","type":"text","marks":[{"type":"code"}]},{"text":" scripts will invoke it.","type":"text"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[149.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Mocha","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[610.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Mocha","type":"text","marks":[{"type":"link","attrs":{"href":"https://mochajs.org/"}}]},{"text":" is the JS test framework used for writing tests in cspace.js projects. It is a library that provides functions like describe() and before(), which form the structure of the tests. Karma is configured to make the Mocha library available to the test bundles running in the browser.","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"Mocha is also itself a test runner, but it never needs to be invoked directly. It is wrapped into Karma, so ","type":"text"},{"text":"npm test","type":"text","marks":[{"type":"code"}]},{"text":" is all you need. Developers writing tests should be familiar with the Mocha API.","type":"text"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[149.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Chai","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[610.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Chai","type":"text","marks":[{"type":"link","attrs":{"href":"http://chaijs.com/"}}]},{"text":" is the assertion library used to make assertions in tests. It provides a fluent, chainable JavaScript API for describing expected results, for example, ","type":"text"},{"text":"result.should.be.an('object').with.property('count', 3)","type":"text","marks":[{"type":"code"}]},{"text":". Karma is configured to make the Chai library available to the test bundles running in the browser. Developers writing tests should be familiar with the Chai API.","type":"text"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[149.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"nyc","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[610.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"n","type":"text"},{"text":"yc","type":"text","marks":[{"type":"link","attrs":{"href":"https://github.com/istanbuljs/nyc"}}]},{"text":" is a test runner for Node.js. Certain cspace.js projects – typically, lower level libraries that have no visible UI – such as cspace-api.js and cspace-client.js, are designed to be usable both in browsers and in Node.js. Karma is great for testing code in browsers, but these projects need to be tested in Node.js as well. Like Karma, nyc wraps Mocha. Mocha itself is a test runner that will run tests in Node.js, but it is not aware of test coverage instrumentation. nyc exists in the development stack for one reason: to output test coverage data from Node.js tests, as Karma is doing for browser tests. This coverage data goes into the ","type":"text"},{"text":"coverage/Node.js","type":"text","marks":[{"type":"code"}]},{"text":" directory, alongside coverage data gathered from browser tests.","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"nyc never needs to be invoked directly. In the projects that need it, ","type":"text"},{"text":"npm test","type":"text","marks":[{"type":"code"}]},{"text":" will execute tests in both nyc and Karma.","type":"text"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[149.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Istanbul","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[610.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Istanbul","type":"text","marks":[{"type":"link","attrs":{"href":"https://istanbul.js.org/"}}]},{"text":" is used to generate test coverage reports from the raw data output by Karma and nyc.","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"Istanbul never needs to be invoked directly. ","type":"text"},{"text":"npm run coverage","type":"text","marks":[{"type":"code"}]},{"text":" will use it to generate reports from the data in the top-level ","type":"text"},{"text":"coverage","type":"text","marks":[{"type":"code"}]},{"text":" directory, which, after running tests, will include data from all browser and Node.js tests. The generated reports will aggregate the data from all the tests, and output a textual report to the terminal, and an HTML report to the ","type":"text"},{"text":"coverage/lcov-report","type":"text","marks":[{"type":"code"}]},{"text":" directory.","type":"text"}]}]}]}]},{"type":"rule"},{"type":"heading","attrs":{"level":2},"content":[{"text":"Cloud Services","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"The following cloud services are used in CollectionSpace JS development.","type":"text"}]},{"type":"table","attrs":{"layout":"center","width":760.0,"localId":"fa71f96c-3d20-4122-a896-020bafabe51c"},"content":[{"type":"tableRow","content":[{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":[144.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Cloud Service","type":"text"}]}]},{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":[616.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Description","type":"text"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[144.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Travis CI","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[616.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Travis CI","type":"text","marks":[{"type":"link","attrs":{"href":"https://travis-ci.org/"}}]},{"text":" provides a cloud-based continuous integration service that is integrated into GitHub. In any cspace.js project, pushing to master will trigger a Travis CI build. Each Travis CI build executes ","type":"text"},{"text":"npm run check","type":"text","marks":[{"type":"code"}]},{"text":", so linting errors or test failures will cause the build to fail. Any pull request made will also trigger a build of that pull request, and the results will be reported on GitHub. Pull requests must build successfully to be accepted.","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"The ","type":"text"},{"text":"output from each build","type":"text","marks":[{"type":"link","attrs":{"href":"https://travis-ci.org/collectionspace"}}]},{"text":" is publicly viewable, and may be checked for error messages when builds fail.","type":"text"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[144.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Sauce Labs","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[616.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Sauce Labs","type":"text","marks":[{"type":"link","attrs":{"href":"https://saucelabs.com/"}}]},{"text":" provides a cloud service that runs tests in a large number of browser/OS combinations. In CollectionSpace JS projects, Sauce Labs support is configured into Travis CI and Karma, so that when tests are run in Travis CI, Karma will start remote browsers in the Sauce Labs cloud, and run the tests in those browsers. The browsers tested in Sauce represent all of the browsers supported by CollectionSpace.","type":"text"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[144.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Coveralls","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[616.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"Coveralls","type":"text","marks":[{"type":"link","attrs":{"href":"https://coveralls.io/"}}]},{"text":" is a test coverage reporting service that makes coverage reports publicly available on the web. In cspace.js projects, Travis CI is configured to send the raw test coverage data generated by Karma to Coveralls, which then generates and makes available a ","type":"text"},{"text":"coverage report","type":"text","marks":[{"type":"link","attrs":{"href":"https://coveralls.io/github/collectionspace"}}]},{"text":" for each build. The coverage report generated by Coveralls is not as detailed as the report generated by Istanbul; in particular, it does not show missed branches. Coveralls is mainly intended to provide a quick way for potential users of a project to evaluate its fitness. It is also integrated into GitHub, and will post notifications on pull requests describing how the pull request affects test coverage. A pull request will not be accepted if it decreases test coverage by more than 5%, or to below 90%.","type":"text"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[144.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"GitHub","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[616.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"GitHub","type":"text","marks":[{"type":"link","attrs":{"href":"https://github.com/"}}]},{"text":" hosts the source code for CollectionSpace JS projects. The repositories available here are intended to be used by developers who are writing code for cspace.js projects. Pull requests are welcome.","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"All repositories are hosted in the ","type":"text"},{"text":"CollectionSpace","type":"text","marks":[{"type":"link","attrs":{"href":"https://github.com/collectionspace"}}]},{"text":" organization. The cspace.js project repositories have names that end with \".js\", such as ","type":"text"},{"text":"cspace-client.js","type":"text","marks":[{"type":"link","attrs":{"href":"https://github.com/collectionspace/cspace-client.js"}}]},{"text":" and ","type":"text"},{"text":"cspace-ui.js","type":"text","marks":[{"type":"link","attrs":{"href":"https://github.com/collectionspace/cspace-ui.js"}}]},{"text":". Each project corresponds 1:1 with a GitHub repository.","type":"text"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[144.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"npm","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[616.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"\"npm\" refers both to the package management tool described above, and in this context, the repository of JavaScript packages hosted at ","type":"text"},{"text":"npmjs.com","type":"text","marks":[{"type":"link","attrs":{"href":"https://www.npmjs.com/"}}]},{"text":". The packages available here are intended to be used by developers writing code for their own projects that utilize cspace.js libraries.","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"Each cspace.js project corresponds 1:1 with an npm package. Packages are published to npm with the same name as the project's GitHub repository, excluding the \".js\" suffix.","type":"text"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[144.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"UNPKG","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[616.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"UNPKG","type":"text","marks":[{"type":"link","attrs":{"href":"https://unpkg.com/"}}]},{"text":" is a (not-for-production) CDN that automatically distributes JavaScript bundles from packages published to npm. The JS bundles available here are intended to be used by CollectionSpace hosters and web developers who want to use CollectionSpace JS libraries on a web page. This is easily done by including a script tag on the page that loads a JS file from the CDN:","type":"text"}]},{"type":"extension","attrs":{"extensionType":"com.atlassian.confluence.migration","extensionKey":"nested-table","text":"","parameters":{"cxhtml":"

`<script src="http://unpkg.com/cspace-ui/dist/cspaceUI.min.js"></script>`

`<script>`

`cspaceUI();`

`</script>`

","nestedContent":{"type":"doc","content":[{"type":"table","attrs":{"layout":"default","localId":"226c6638-5f37-4058-8313-dcd85580ad30"},"content":[{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"background":"initial","rowspan":1},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"","type":"text","marks":[{"type":"code"}]}]}]}]}]}],"version":1},"adf":"{\"type\":\"doc\",\"content\":[{\"type\":\"table\",\"attrs\":{\"layout\":\"default\",\"localId\":\"226c6638-5f37-4058-8313-dcd85580ad30\"},\"content\":[{\"type\":\"tableRow\",\"content\":[{\"type\":\"tableCell\",\"attrs\":{\"colspan\":1,\"background\":\"initial\",\"rowspan\":1},\"content\":[{\"type\":\"heading\",\"attrs\":{\"level\":6},\"content\":[{\"text\":\"\",\"type\":\"text\",\"marks\":[{\"type\":\"code\"}]}]}]}]}]}],\"version\":1}","reason":"A table in a table cell can't be created or edited in the new editor."}}},{"type":"heading","attrs":{"level":6},"content":[{"text":"See the ","type":"text"},{"text":"CodePen demos","type":"text","marks":[{"type":"link","attrs":{"href":"http://codepen.io/collection/DaekJP"}}]},{"text":" for complete examples of using the cspace-ui package on a web page.","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"Each cspace.js project will have two bundles hosted on UNPKG: a development bundle (named with the \".js\" extension), and a minified production bundle (named with the \".min.js\" extension). ","type":"text"}]},{"type":"heading","attrs":{"level":6},"content":[{"text":"For production you'll want to download the JS file you're using, and host it on your own server or another CDN with uptime guarantees that meet your needs.","type":"text"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[144.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"CodePen","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[616.0]},"content":[{"type":"heading","attrs":{"level":6},"content":[{"text":"CodePen","type":"text","marks":[{"type":"link","attrs":{"href":"http://codepen.io/"}}]},{"text":" hosts ","type":"text"},{"text":"demos","type":"text","marks":[{"type":"link","attrs":{"href":"http://codepen.io/collection/DaekJP"}}]},{"text":" of configuring and displaying the CollectionSpace UI on a web page. There's no particular reason to use CodePen over similar services like JSFiddle or JS Bin. Those other services may be used in the future. Note that in order to access the REST API on ","type":"text"},{"text":"nightly.collectionspace.org","type":"text","marks":[{"type":"link","attrs":{"href":"http://nightly.collectionspace.org/"}}]},{"text":" from a page hosted on another service, the CORS configuration on nightly must be amended with that service's hostname.","type":"text"}]}]}]}]},{"type":"rule"},{"type":"paragraph"}],"version":1}

$ git clone https://github.com/collectionspace/cspace-ui.js.git

$ cd cspace-ui.js

$ npm install

$ npm run

Lifecycle scripts included in cspace-ui:

prepublish

...

start

...

test

...

available via `npm run-script`:

build

...

build-cjs

...

build-umd

...

build-umd-dev

...

build-umd-prod

...

check

...

clean

...

...

$ npm run clean

...

$ npm test

...

<script src="http://unpkg.com/cspace-ui/dist/cspaceUI.min.js"&gt;&lt;/script>

<script>

cspaceUI();

</script>

`$ git clone https://github.com/collectionspace/cspace-ui.js.git`

`$ cd cspace-ui.js`

`$ npm install`

`$ npm run`

`Lifecycle scripts included in cspace-ui:`

`prepublish`

`...`

`start`

`...`

`test`

`...`

`build`

`...`

`build-cjs`

`...`

`build-umd`

`...`

`build-umd-dev`

`...`

`build-umd-prod`

`...`

`check`

`...`

`clean`

`...`

`...`

`$ npm run clean`

`...`

`$ npm test`

`...`

`<script src="http://unpkg.com/cspace-ui/dist/cspaceUI.min.js"></script>`

`<script>`

`cspaceUI();`

`</script>`

Browser not supported