Plastic Bag

Plastic Bag is a Custom Element that uses different strategies to load Frontend applications/components.

Installation

npm install plastic-bag

Registering the Custom Element plastic-bag:

import 'plastic-bag';
// or
require('plastic-bag');

<script src="https://unpkg.com/plastic-bag/dist/index.js" />

<plastic-bag type="script" src="/app.js">
    <div id="app-example">Loading...</div>
</plastic-bag>

<plastic-bag type="html-fragment" src="/header.html">
</plastic-bag>

URI of the resource that will be loaded.

Each type uses a different strategy to load the application source. Default value: "script".

"script": fetchs and execute src.
"iframe": uses iframe to display src.
"html-fragment": fetchs src, puts its content inside plastic-bag and executes script tags if present.

The content will be displayed as soon the tag is attatched.

We are working on browser compatibility tests with BrowserStack.

Name		Name	Last commit message	Last commit date
Latest commit History 112 Commits
images		images
src		src
test		test
.gitignore		.gitignore
.npmignore		.npmignore
.npmrc		.npmrc
.prettierrc		.prettierrc
.travis.yml		.travis.yml
CODE_OF_CONDUCT.md		CODE_OF_CONDUCT.md
LICENSE		LICENSE
README.md		README.md
package-lock.json		package-lock.json
package.json		package.json
tsconfig.es5.json		tsconfig.es5.json
tsconfig.json		tsconfig.json
tslint.json		tslint.json
wdio.conf.js		wdio.conf.js
webpack.config.es5.js		webpack.config.es5.js
webpack.config.js		webpack.config.js
webpack.config.polyfills.js		webpack.config.polyfills.js
webpack.config.tests.js		webpack.config.tests.js