occ-shared-resource-bundles

"Chunked" Dynamically Linked Libraries(DLL) via webpack for Oracle Commerce Cloud . Use with occ-react-component or any webpack application. Note: This particular version compiles to AMD RequireJS modules.

version 2.3.0

Release Notes

2.3.0

• adding timestamp to file name
• added OCC global application file template

2.2.0

• added axios

2.1.0

• various bug fixes and node version check

2.0.0

• Full Refactor to Shared Resource Bundle using webpack SplitChunks
• Base library includes

 "dependencies": {
    "classnames": "^2.2.6",
    "react": "^16.7.0",
    "react-dom": "^16.7.0",
    "react-hot-loader": "^4.6.3",
    "styled-components": "^4.1.3"
  }

About

This library is used as the primary dependency resource for multiple webpack applications such as the occ-react-component The idea is that you have self contained Oracle Commerce Cloud React Applications suckling off the teet of the vendor bundles. SUPER cool stuff. This reduces dependency redundencies across your installed modules, optimizes load time, and speeds up development.

Important

If this bundle changes then your will need to recompile your components with the updated manifest file.

Instructions

1. Install the dependencies you wish to include in your global bundle.

$ npm i {YOUR_MODULES ...} --save

2. Add those modules to the webpack.config.js entry configuration array so they will be included in the build

entry: {
    "vendor": [
        'react',
        'react-dom',
        ...
        ...
    ]
}

3. Update webpack.config.js with the name of the OCC Application Widget file that will be installed into your OCCS instance. You will use the DCU to upload the file in step 5

  OCC_GLOBAL_FILE_NAME: {FILE NAME}

Important For step 4, DO NOT use webpack minification as OCC already performs this task and you will waste hours wondering what's wrong.

4. Build either a development or production version.

Development: contains Hot Module reload dependencies as well as sourcemaps. (Minified)

$ nmp run build:dev

Production: Contains only production level dependencies or their respective production states. (Not minified).

$ nmp run build:prod

Both: Will build both versions

$ nmp run build

* the compiled filename will be postfixed with '-[dev | prod]'

5. To deploy.

First upload the occ component located occ/globaljs.
OCC will not allow you to upload require js files where the dependency path does not math the file. Do a DCU grab and then replace the contents of the grabbed file with prod j vendor-dev-{VERSION}.dll.jss. DCU put the new file to OCCS.

Steps:

// 1. DCU grab
$ dcu --grab --clean -n https://{your instance}.oracleoutsourcing.com

// 2. Deploy
$ dcu --put global/{OCC_GLOBAL_FILE_NAME} --node https://{OCCS_INSTANCE}.oracleoutsourcing.com -k {APPLICATION KEY

Verify that your file is there by inspecting the network requests in your browser.

6. Copy both the dev and prod vendorManifest/vendor-{prod|dev}.{VERSION}.json files to your occ-react-component folder

7. Go here for instructions in setting up your component. (React example)!

Credits

nodejs webpack 4 babel 7 eslint react flow reactjs react-hot-loader styled-components Oracle DCU

Related

Check out the React Solution for Oracle Commerce cloud for a working proof on concept of how to use React as a quasi headless UI framework integrated into the OCC Admin.

Disclaimer of Warranty.

THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY APPLICABLE LAW. EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE. THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE PROGRAM IS WITH YOU. SHOULD THE PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF ALL NECESSARY SERVICING, REPAIR OR CORRECTION.