Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/ecomclub/ecomplus-storefront-renderer
Vue.js app to render E-Com Plus store template
https://github.com/ecomclub/ecomplus-storefront-renderer
ecommerce-framework ecommerce-storefront ecomplus jamstack store-renderer storefront vue
Last synced: about 2 months ago
JSON representation
Vue.js app to render E-Com Plus store template
- Host: GitHub
- URL: https://github.com/ecomclub/ecomplus-storefront-renderer
- Owner: ecomclub
- License: apache-2.0
- Created: 2018-01-24T21:52:36.000Z (almost 7 years ago)
- Default Branch: master
- Last Pushed: 2019-05-27T15:15:49.000Z (over 5 years ago)
- Last Synced: 2024-11-13T09:52:27.574Z (about 2 months ago)
- Topics: ecommerce-framework, ecommerce-storefront, ecomplus, jamstack, store-renderer, storefront, vue
- Language: JavaScript
- Homepage: https://developers.e-com.plus/storefront-renderer/
- Size: 2.62 MB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# storefront-renderer
[![CodeFactor](https://www.codefactor.io/repository/github/ecomclub/storefront-renderer/badge)](https://www.codefactor.io/repository/github/ecomclub/storefront-renderer)
[![npm version](https://img.shields.io/npm/v/@ecomplus/storefront-renderer.svg)](https://www.npmjs.org/@ecomplus/storefront-renderer)
[![license mit](https://img.shields.io/badge/License-Apache-orange.svg)](https://opensource.org/licenses/Apache-2.0)Render E-Com Plus store templates with Vue.js 2.
**[Storefront themes documentation](https://developers.e-com.plus/docs/themes/)**
[Renderer API reference](https://developers.e-com.plus/storefront-renderer/)
## Browser
### Recommended
Include minified bundle via CDN:
```html
```
By default, it declares `Vue`, `Ecom`, `EcomIo` and `EcomInit`
objects globally (on browser `window`).### Standalone
You can include the render standalone, it **requires** global `EcomIo` object from
[storefront JS SDK](https://github.com/ecomclub/ecomplus-sdk-js) and
[Vue](https://vuejs.org/v2/guide/#Getting-Started):```html
```
### With bundlers
If using `webpack` or `browserify` (or relateds),
you can also install the
[npm package](https://www.npmjs.com/package/@ecomplus/storefront-renderer):```bash
npm install --save @ecomplus/storefront-renderer
```And import the bundle file:
```js
import '@ecomplus/storefront-renderer/dist/storefront.min.js'
```You may also declare imported objects
instead of using globals:```js
import { Vue, Ecom, EcomIo, EcomInit } from '@ecomplus/storefront-renderer/dist/storefront.min.js'
```## Server side rendering
The package is also compatible with NodeJS backend,
handling SSR with
[jsdom](https://github.com/jsdom/jsdom) and
[Vue SSR](https://ssr.vuejs.org/).Even rendered pages must include the render to run on browser,
HTML will be updated (hydrate) client-side
to keep critical data always up to date.### Command line
```bash
npm i -g @ecomplus/storefront-renderer
storefront-renderer https://mystore.com/product > product.html
```### Node
```javascript
require('@ecomplus/storefront-renderer')(html).then(({ dom, Ecom }) => {
Ecom.init().then(() => {
// jsdom object
console.log(dom.serialize())
})
})
```## Developing
Setup the package with GitHub and NPM:
```bash
git clone https://github.com/ecomclub/storefront-renderer
cd storefront-renderer
npm i
```Watch tests server:
```bash
npm run serve
```Update JSDoc files on `docs` folder:
```bash
npm run doc
```Compile to production:
```bash
npm run build
```