{"_id":"@alonso.lares/vue-components","_rev":"3-b4cdd635f08dd833d8324d8582a7289c","name":"@alonso.lares/vue-components","dist-tags":{"latest":"0.1.2"},"versions":{"0.1.0":{"name":"@alonso.lares/vue-components","version":"0.1.0","private":false,"scripts":{"build-bundle":"vue-cli-service build --target lib --name myLib ./src/core/components/Baner/Baner.vue ","start":"vue-cli-service serve","serve":"vue-cli-service serve","build":"vue-cli-service build --mode production"},"dependencies":{"axios":"^0.18.0","v-yokozuna":"git+ssh://git@code.lkmx.io:yokozuna/v-yokozuna.git","vee-validate":"^2.1.1","vue":"^2.5.17","vue-router":"^3.0.1","vuex":"^3.0.1"},"devDependencies":{"@vue/cli-plugin-babel":"^3.0.5","@vue/cli-service":"^3.0.5","node-sass":"^4.9.0","sass-loader":"^7.0.1","vue-template-compiler":"^2.5.17"},"main":"./dist/myLib.common.js","gitHead":"5d1035c358dac20f3eaaf4768305dfa13005f2ac","description":"Plantilla web basada en Vue 2.0 y V-Yokozuna","_id":"@alonso.lares/vue-components@0.1.0","_nodeVersion":"11.10.0","_npmVersion":"6.7.0","dist":{"integrity":"sha512-YDKbS2SjGu3Af7DOfckPHQ2A6AbxJW8YuBvn/+f8yCTJTMW3WIjJlPcOWF/ldIF/WaKbAYUsPkj34FoBieK/1w==","shasum":"a6a43154b5960341fc76d49fecc336b6ba41996b","tarball":"https://registry.npmjs.org/@alonso.lares/vue-components/-/vue-components-0.1.0.tgz","fileCount":48,"unpackedSize":571900,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJciTlWCRA9TVsSAnZWagAAARcP/324u56k+vQ3otocxUNS\n27lF55o+k4N1AwPIci2K41eFhoZaF3s3YXkWmfPmgjeMOU7Rbk0qgBQvBt7j\n3L3zDKdKSLj/Vp8w7o2UYY9fmIs0Ck6JPudc/v4xm87OBdOn39PAWIhNwQlk\nlCLyKZvFehhhzg3D5w+6hyQweTVAaJaftdz6ACuDY+/jHwu/m7I7NHyM8g73\nbiKKUTv7XgAsP4tOrY1flyKjCuOso7KIS9dWcCIfWAQUFQdV2te5cefAy7q0\nN4YMuyV4+0VVKLHLzs1KyK0tW0yqa/bBytxCB7xtDh/HrtfZu0f+qVyL9Sbz\ntsYa3zG0TaSV2t9Mau9MRV/F9ZF6GHbbl4q3Loo3OoaAvj29Y9nkjRq2hyb7\niITQlz3s0ZMRZcPScWUqGinUBYhVEbQEbenmadCXfFr02zfWKTmxJeCH8Upo\nT8/Jze+VT9bAQHBoCSZcqzb/UST20nWgzPmbtUK3N5o7kzJ6rHdyWuU1aILU\nXR59Vnk9eT15HvdjuELRQ/f1fjRptWSUO5NaqU6Ha8EjSq0Lhw+GOZ7L4Z1v\nxOlE68onX1/B9BPTChenUqJqh0z6XUMXe6C6FD43Z0fI3myOJGQTijtwBsZb\nrwD6EYHakcGyLli7O0ycOwS9qUUn0FbwHk7mXeHcU5Dix1BMmLoYDHvTg+LX\nlbbl\r\n=vSAs\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFOsS5PzzUUXK0tTckUzfDtfkjIXhXPY/PGRJx84jdgGAiEA+FWNnBJZ1SGeIRqs4AwUm7AfG35LBOFeiTGKn47pMDY="}]},"maintainers":[{"name":"alonso.lares","email":"alonso.lares@lkmx.io"}],"_npmUser":{"name":"alonso.lares","email":"alonso.lares@lkmx.io"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-components_0.1.0_1552496981845_0.3704365061814827"},"_hasShrinkwrap":false},"0.1.1":{"name":"@alonso.lares/vue-components","version":"0.1.1","private":false,"scripts":{"build-bundle":"vue-cli-service build --target lib --name myLib ./src/core/components/Baner/main.js ","start":"vue-cli-service serve","serve":"vue-cli-service serve","build":"vue-cli-service build --mode production"},"dependencies":{"axios":"^0.18.0","v-yokozuna":"git+ssh://git@code.lkmx.io:yokozuna/v-yokozuna.git","vee-validate":"^2.1.1","vue":"^2.5.17","vue-router":"^3.0.1","vuex":"^3.0.1"},"devDependencies":{"@vue/cli-plugin-babel":"^3.0.5","@vue/cli-service":"^3.0.5","node-sass":"^4.9.0","sass-loader":"^7.0.1","vue-template-compiler":"^2.5.17"},"main":"./dist/myLib.common.js","gitHead":"5d1035c358dac20f3eaaf4768305dfa13005f2ac","description":"Plantilla web basada en Vue 2.0 y V-Yokozuna","_id":"@alonso.lares/vue-components@0.1.1","_nodeVersion":"11.10.0","_npmVersion":"6.7.0","dist":{"integrity":"sha512-M2euxmsAcaNnxg2HAunKZ7/b7r+r+k1dpDX4wfMSzbYSL8uEXteAgaMK4KpzpPC0sQ/G3l65Se0dh4VSom9iYQ==","shasum":"c90cbe693ba8cc6095d1afd622b357e424c8b945","tarball":"https://registry.npmjs.org/@alonso.lares/vue-components/-/vue-components-0.1.1.tgz","fileCount":49,"unpackedSize":581899,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJciTpDCRA9TVsSAnZWagAA+V8P/1SDLeFeAH8BGUHy9+7L\nLUQZT14Lfsd+99ta0avZ8kXpqAYsGHBw1nca8rpjIQVJRpDQhAS0rbnLq/qm\nLUzIwbgOa4RocVVTPDJdRaKkbxfbYOIrzfpQ8W5aRuCox9FYlLs3ijd20jDE\nGqaUa3SWfVT4/EcXgScMFjw3pjB0E6QLrD81Xnt3AatONawSiEoAwkPvX3MS\nWfPWtVXnW+oOQnDd9nB0NW3ETuAD2SbF/nKVk8cjXYxdUOPgKGGMTShxaagK\nH8GZgLppCru9k5AXUOZLBKjRqB76AftD2A6T7HrIwTEAeJ9DRUS+AZja1oM+\nZLAPfjnAJG58ZtBiOenmomayeuwLhgBCHOWkqHcA2vwb9Iwww+YLH7NjSpwq\nPGvXu/o/ELr2Ugqo0xVLkXsNwoagr3fS90AIPTKyo0GXeUe6DxlaWz10TVgn\nKng7szKkoHHarFkmV5HAmVveQq3wcTCDGfPEL6a0ro583GTG6qkqR2O0Tesy\n0GiTPcGqsGZSpe8kDPDbtC96d4iB03wr10MjNr89Y8XiUi1DQC7Ndx1kgvH7\nLBjq/GOGQaPffcttX7iVkl41MCaOkPc3PgMcfmScXsfXcgtirIWNPeIThKMO\nDQ3z0n3EFkUX0g51M52fy7427yk8J57d8HiBpZ1c7TCmcZu8D9Kn9vkh9w1E\nGXqc\r\n=2qJD\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDbfQeR4gb7El1dU2D7bdR9U81HZ1lX2yPG8Xdh2hN2tgIgJg+XloZMcSygdLuRk9zkP5E2pUUR5XMYicT3qadcUI8="}]},"maintainers":[{"name":"alonso.lares","email":"alonso.lares@lkmx.io"}],"_npmUser":{"name":"alonso.lares","email":"alonso.lares@lkmx.io"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-components_0.1.1_1552497218822_0.033474374001630114"},"_hasShrinkwrap":false},"0.1.2":{"name":"@alonso.lares/vue-components","version":"0.1.2","private":false,"scripts":{"build-bundle":"vue-cli-service build --target lib --name myLib ./src/core/components/Baner/main.js ","start":"vue-cli-service serve","serve":"vue-cli-service serve","build":"vue-cli-service build --mode production"},"dependencies":{"axios":"^0.18.0","v-yokozuna":"git+ssh://git@code.lkmx.io:yokozuna/v-yokozuna.git","vee-validate":"^2.1.1","vue":"^2.5.17","vue-router":"^3.0.1","vuex":"^3.0.1"},"devDependencies":{"@vue/cli-plugin-babel":"^3.0.5","@vue/cli-service":"^3.0.5","node-sass":"^4.9.0","sass-loader":"^7.0.1","vue-template-compiler":"^2.5.17"},"main":"./dist/myLib.common.js","gitHead":"5d1035c358dac20f3eaaf4768305dfa13005f2ac","description":"Plantilla web basada en Vue 2.0 y V-Yokozuna","_id":"@alonso.lares/vue-components@0.1.2","_nodeVersion":"11.10.0","_npmVersion":"6.7.0","dist":{"integrity":"sha512-swI4/Ov4QHPne4lf6+gV28ACS+7pE0W1pW43H+nLixRjRYM+mdKd7pl4zgU/5og9d8JntufnAGxW/5tEui5Qxw==","shasum":"064ba9973556e0eb2ca56db72f3189439432d1eb","tarball":"https://registry.npmjs.org/@alonso.lares/vue-components/-/vue-components-0.1.2.tgz","fileCount":49,"unpackedSize":581899,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJciT9ICRA9TVsSAnZWagAA4s0P/jObmh/E94v3FQA2wZBk\nzm0kG4kcLbZgFjTQz/udtnvgPxn5lzwmTu4QC97xi6/6Xvp346hGAMguh9ZS\npCGta8Lg/78m0Cxstxr6xUoNw8eQJUDh0ynK1XX1pAHy3bMHXIN+Doi1wryu\nUh51OwG8EysC2/XJeiUiAGnJHG3KEsI854NkHtnAq7U9/Rq6F0Lo259B3QdI\nod7mpI6Snuv9w5/EY2ek6+Mw2BVhvWk7pwkcmdfGLc4brJqewmYWw9l4JYea\ndU382p7LNhCX7EzHUT10rO4825K8840wkFMy7Px152ahwSmhqTXeHTaK5+sp\nwYnNoiZ2DURtFW7FE103phiFaxzpuPVcHe6r6W6n0fq9aRmF5MzZ+tekXFmH\nTcsuUCe1x9zLHxzVW7i0WV3M4vmp4gvKNP1x/HyR/paYEvGkuPzZIcTcAfRA\nEagzZqrNVsSHTLtmQg2z/K+2OqKC+HhOjed3GS6pphfRMbGPMiBxjQRl8L+O\noqzN3R2ukA1xDemf1MHM3h6H7OItlsqiwLn1nfdfTL5nK0KXk80hF4Y/7dpt\n+zltgPmtEfIY4+c8ytnDqVDressAjv2T6t5PeuGDJII/zPXggVrWxo3KINpI\n9grCCQZECIVlf9yEfczOK2ksr1Xr2uny17YZZKjdKvax0YkZ0sTx2bP9XBIP\nEjIN\r\n=CH+b\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDmjLNEtSOLlqKLWkZrnt+cdxm4lfE5sWj2u82TXT+dhAIgOZBEgp95Yhexufg/DcSH0vQD3jbAYY53xMdUB4VvKYo="}]},"maintainers":[{"name":"alonso.lares","email":"alonso.lares@lkmx.io"}],"_npmUser":{"name":"alonso.lares","email":"alonso.lares@lkmx.io"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-components_0.1.2_1552498503937_0.6246215613723352"},"_hasShrinkwrap":false}},"time":{"created":"2019-03-13T17:09:41.655Z","0.1.0":"2019-03-13T17:09:41.957Z","modified":"2022-04-04T13:37:01.819Z","0.1.1":"2019-03-13T17:13:39.059Z","0.1.2":"2019-03-13T17:35:04.091Z"},"maintainers":[{"name":"alonso.lares","email":"alonso.lares@lkmx.io"}],"description":"Plantilla web basada en Vue 2.0 y V-Yokozuna","readme":"# WWW-Template\n\nPlantilla web basada en Vue 2.0 y V-Yokozuna\n\n- [WWW-Template](#www-template)\n  - [Primeros Pasos](#primeros-pasos)\n    - [Organización del Proyecto](#organizaci%C3%B3n-del-proyecto)\n    - [Iniciar Aplicación](#iniciar-aplicaci%C3%B3n)\n    - [Construir Artefacto](#construir-artefacto)\n  - [Agregar Dependencias](#agregar-dependencias)\n  - [Agregar Vista](#agregar-vista)\n  - [Agregar Servicio](#agregar-servicio)\n  - [Agregar Componente](#agregar-componente)\n  - [SASS](#sass)\n  - [Extras](#extras)\n    - [Variables de entorno](#variables-de-entorno)\n\n## Primeros Pasos\n\n### Organización del Proyecto\n\nEl proyecto está organizado de la siguiente manera\n\n```\n.\n├── babel.config.js\n├── Dockerfile\n├── nginx.tmpl\n├── package.json\n├── package-lock.json\n├── postcss.config.js\n├── public\n│   ├── favicon.ico\n│   └── index.html\n├── README.md\n├── src\n│   ├── App.vue\n│   ├── assets\n│   │   ├── fonts\n│   │   ├── img\n│   │   └── styles\n│   ├── core\n│   │   ├── components\n│   │   ├── config\n│   │   ├── directives\n│   │   ├── filters\n│   │   ├── polyfills\n│   │   └── service\n│   ├── main.js\n│   ├── router.js\n│   ├── vendor.js\n│   └── views\n│       └── welcome\n└── vue.config.js\n\n\n```\n\nDonde\n\n- src: Mantiene los archivos de código fuente de la aplicación.\n  - `App.vue`: Es el componente principal de la aplicación\n  - `assets`: Contiene los archivos que son recursos simples para el uso de la aplicación, css, imágenes, etc. - `core`: Contiene los archivos donde se deposita la lógica de componentes que serán utilizados de manera general por las vistas de la aplicación\n    - `components`: Contiene los componentes de la aplicación.\n    - `config`: Contiene los archivos de configuración.\n    - `directives`: Contiene los archivos de directivas,\n    - `filters`: Contiene los archivos de filtros.\n    - `polyfills`: Contiene los archivos de retrocompatibilidad de js.\n    - `services`: Contiene los archivos de servicios. - `pages`: Contiene los archivos de lógica y plantillas de las vistas.\n  - `main.js`: Contiene la lógica de `bootstraping` de la aplicación.\n  - `router.js`: Módulo donde se confiugra el `router` de la aplicación.\n  - `vendor.js`: En el se declaran las liberías que se importan para ser utilizadas en la aplicación.\n  - `views`: Contiene las vistas de la aplicación\n\n    - `welcome`: Vista por defecto de la aplicación\n\n### Iniciar Aplicación\n\nPara iniciar el proyecto primero debes instalar las dependencias del mismo con el siguiente comando\n\n```\n$ npm install\n```\n\nY para levantar el servidor de desarrollo de la aplicación debes ejecutar la siguiente instrucción en la consola\n\n```\n$ npm start\n```\n\n### Construir Artefacto\n\nPara construir el artefacto de la aplicación en la consola debes ejecutar los siguientes comandos\n\n```\n$ npm run build\n$ docker build -t [namespace]/[nombre-imagen] .\n```\n\n> Es necesario que tengas instalado docker en tu equipo consulta la siguiente liga para obtener más información sobre cómo instalar docker: [https://docs.docker.com/install/](https://docs.docker.com/install/ \"https://docs.docker.com/install/\").\n> Para obtener más información sobre namespace de docker consulta la siguiente liga: [https://success.docker.com/article/introduction-to-user-namespaces-in-docker-engine](https://success.docker.com/article/introduction-to-user-namespaces-in-docker-engine \"https://success.docker.com/article/introduction-to-user-namespaces-in-docker-engine\")\n\n## Agregar Dependencias\n\nSi requieres agregar una dependencia al proyecto debes asegurarte que la misma exista dentro del reposositorio npm que estés utilizando.\n\nEl siguiente ejemplo muesta cómo agregar angular-translate\n\n```\n$ npm install angular-translate --save\n```\n\nEn el archivo `vendor.js`\n\n```\nsrc/\n└── vendor.js\n\n```\n\nImportar la libería de angular translate\n\n```javascript\nvendor.js;\n\nimport Vue from \"vue\";\n```\n\n> De ser necesario deberás registrar el módulo de la libería en el módulo de tu aplicación.\n\n## Agregar Vista\n\nEl siguiente ejemplo muestra cómo puedes agregar una vista\n\nAgregamos los archivos necesarios al ruta de `pages`\n\n```\nsrc/views/\n└── welcome\n    ├── welcome.js\n    ├── welcome.vue\n    └── welcome.init.js\n```\n\n```javascript\nwelcome.js;\n\nexport default {\n  name: \"Welcome\",\n  data() {\n    return {};\n  },\n  methods: {},\n  mounted() {}\n};\n```\n\n```html\nwelcome.html\n\n<template>\n  <main class=\"welcome\">HELLO WORLD!</main>\n</template>\n<script src=\"./welcome.js\"></script>\n```\n\n```javascript\nwelcome.init.js;\n\nimport Router from \"../../router\";\n\nRouter.addRoutes([\n  {\n    path: \"/\",\n    name: \"welcome\",\n    component: () => import(\"./welcome.vue\")\n  }\n]);\n```\n\n> `import Router from '../../router';` importa el módulo de `router` al archivo de javascript para poder asociar el componente a la aplicación.\n\n## Agregar Servicio\n\nEl siguiente ejemplo muestra cómo agregar un servicio\n\nAgregamos el archivo del servicio a la ruta de servicios\n\n```\nsrc/core/services/\n└── client.js\n```\n\n```javascript\nclient.js;\n\nconst client = {};\n\nexport default client;\n```\n\nimportamos el servicio donde requieramos usarlo\n\n```javascript\nwelcome.js;\n\nimport client from \"../core/services/client\";\n\nexport default {\n  name: \"Welcome\",\n  data() {\n    return {};\n  },\n  methods: {},\n  mounted() {\n    client.get(\"http://api/objects\");\n  }\n};\n```\n\n## Agregar Componente\n\nEl siguiente ejemplo muestra cómo agregar un componente\n\nAgregamos los archivos del componente a la ruta de componentes\n\n```\nsrc/app/component/\n└── side-nav\n    ├── side-nav.vue\n    └── side-nav.js\n```\n\n```javascript\nside - nav.js;\n\nconst sideNav = {\n  name: \"side-nav\",\n  data() {\n    return {};\n  }\n};\n```\n\n```html\nside-nav.vue\n\n<template>\n  <div class=\"side-nav\"></div>\n</template>\n\n<script src=\"./side-nav.js\"></script>\n```\n\n## SASS\n\nLos archivos de sass deben colocarse dentro de la ruta de `src/assets/style/sass`\n\nEl siguiente ejemplo muestra cómo debe agregarse un archivo de sass\n\n```\nsrc/assets/styles/sass/\n├── index.scss\n└── components\n    └── _side-nav.scss\n```\n\n```scss\nindex.scss\n\n@import 'components/side-nav';\n```\n\n> `index.scss` es un archivo boostraping donde se registran los estilos para ser descubiertos por el servicio de compilación.\n\nPara importar estilos de una libería instalada a través de npm debe realizarse de la siguiente manera:\n\nEl siguiente ejemplo muestra cómo agregar bootstrap\n\n```\n$ npm install bootstrap-sass --save\n```\n\n```scss\nindex.scss\n\n$icon-font-path: '~bootstrap-sass/assets/fonts/bootstrap/';\n\n@import '~bootstrap-sass/assets/stylesheets/bootstrap';\n@import '~bootstrap-daterangepicker/daterangepicker.css';\n```\n\n## Extras\n\n### Variables de entorno\n\nEste proyecto está configurado para permitir el usuario de variables de entorno al ser desplegado dentro de un contenedor de docker.\n\nEl siguiente ejemplo muestra cómo agregar una variable de entorno\n\nEn nuestro archivo de ambiente agregamos la variable de entorno que queremos agregar.\n\n```javascript\nenv.production;\n\nVUE_APP_APIURL = \"API_URL\";\n```\n\nEn el archivo `nginx.tmpl` agregamos el **sub_filter** de la variable\n\n```\nnginx.tmpl\n\n\t...\n\n\thttp {\n\n    \tserver {\n        \tsub_filter \"api_url\" \"${API_URL}\";\n    \t}\n\t...\n\n}\n```\n\nUsando la variable de entorno\n\n```javascript\nclient.js;\n\nconst apiUrl = process.env.VUE_APP_APIURL;\n\nconst client = {\n  get: function(path, config) {\n    return manageCallback(axios.get(apiUrl + path, config));\n  }\n};\n\nexport default client;\n```\n","readmeFilename":"README.md"}