gl-w-menu-frontend
What is this repository for?
This package (glaucioleonardo-web-menu-frontend) is a common code for using among web front-end development
such as ES6+ and TypeScript.
This package contains the types for using with Typescript.
How do I get set up?
The easiest way to install this library is via npm using the following commands:
- Latest version
npm install gl-w-menu-frontend --save; -
Available versions
npm install gl-w-menu-frontend@version --save;
If you are using only browser version:
- For ES5 version importing via
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>gl-w-frontend</title>
...
</head>
<body>
...
<!-- Dependencies must be placed in order -->
<script src="https://code.jquery.com/jquery-3.5.1.js"></script>
<script
src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"
integrity="sha256-VazP97ZCwtekAsvgPBSUwPFKdrwD3unUfSGVYrahUqU="
crossorigin="anonymous">
</script>
<script src="https://github.com/sindresorhus/screenfull.js/blob/master/dist/screenfull.min.js"></script>
<script src="https://github.com/moment/moment/blob/develop/dist/moment.js"></script>
<script src="https://github.com/rotaready/moment-range/blob/master/lib/moment-range.js"></script>
<!-- Excel dependencies -->
<script lang="javascript" src="https://github.com/SheetJS/sheetjs/tree/master/dist/xlsx.full.min.js"></script>
<script lang="javascript" src="https://github.com/dtjohnson/xlsx-populate/blob/master/browser/xlsx-populate.js"></script>
<!-- Include here -->
<script src="https://github.com/glaucioleonardo/gl-w-frontend/tree/master/lib/index.js"></script>
<!-- or just download this repo and refer to the index.js like this -->
<script src="js/index.js"></script>
</body>
</html>
Important:
-
The library "moment-range" makes use of
Symbol.iteratorto provide the iteration protocols. If you need to support older browsers (specifically IE11+) you will need to include a polyfill. Any of the following should work, depending on your project configuration: -
core-js: Tested with this polyfill (working on IE10+).
-
In case you are using ES+, just use the
bundle.jsinsidelib/es6
Importing assets of this library
- If you are using nodejs, you can just copy/refer the folder insinde
node_module/gl-w-frontend/lib/assets; - Angular: open the
angular.jsonand paste this code in :
{
...
"projects": {
"my-project-angular": {
...
"architect": {
"build": {
...
"options": {
...
"assets": [
...
{
"glob": "**/*",
"input": "node_modules/gl-w-frontend/lib/assets",
"output": "/assets"
}
],
},
...
},
...
}
}},
...
}
- Browser version: copy the folder assets and add to your public folder or save anywhere and in
the following method inform the folderUrl (optional parameter).
AttachmentIcon.get(..., folderUrl: string /*inform the folser url*/)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>gl-w-frontend</title>
...
</head>
<body>
...
</body>
</html>