Package Exports

viewson
viewson/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (viewson) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

This is a view engine in which you can write the html in a JSON or ~~BSON~~ format. You can also input a normal js object or a JSON string but that is not recommended.

Index:

How to enter tags
How to add attributes
How to add dynamic content
What are the parameters of the render function
How can we enter a JSON string
How can we enter a Javascript Object as an input
Additional information

How to enter tags:

You can enter tags like this:

    {
        "html5":{
            "head":{
                "title":{
                    "content":"Document"
                }
            }
            "body":{
                "p":{
                    "content":"This is a paragraph"
                }
            }
        }
    }

Like this we can do nesting and add tags.

We can also add attributes like this:

    {
        "html5":{
            "head":{
                "title":{
                    "content":"Document"
                }
            },
            "body":{
                "p":{
                    "content":"This is a paragraph",
                    "attributes":[{"style":"{color:red;}"},{"class":"paragraph1"}]
                }
            }
        }
    }

There is one more way to do nesting: We can also make content a object and put tags in it.

This package also supports dynamic content.

In the last parameter of the compile function we can add the dynamic content, specify the content like you do in the JSON file but it should be in a JS object. Click here to get more information about the parameters of the compile function. In the json or bson file write dynamic as a key instead of content and write the key in the content which you specified in the dynamic content parameter.

For eg. this is the dynamic content we passed:

  {
      yay: {
        content: "This is dynamic!",
        attributes: [{ class: "highlight" }]
      }
  }

And we can use it as this in our json file:

{
  "html5": {
    "head": {
      "title": {
        "content": "Test Page"
      }
    },
    "body": {
      "h1": {
        "p":{
          "content":"Nested"
        }
      },
      "p":{
        "dynamic":"yay"
      }
    }
  }
}

Parameters of the render function (This is the function for JSON file)

How to use it: render()

Parameter name	Use
filename	The filepath of the file where you have written your json.
res	The response object.
have	The basic dependencies the project uses like express.
dynData	The dynamic data. For more information click here

render with JSON

How to use it: renderWithoutFilename()

Parameter name	Use
filename	The JSON string.
res	The response object.
have	The basic dependencies the project uses like express.
dynData	The dynamic data. For more information click here

render with Javascript Object

How to use it:renderObject()

Parameter name	Use
filename	The Javascript object.
res	The response object.
have	The basic dependencies the project uses like express.
dynData	The dynamic data. For more information click here

Additional information

License

Third-Party Dependencies

This project makes use of the following open-source package:

bson — Licensed under the Apache License 2.0

Please refer to each dependency’s repository and license for more information.