Blog de conocimiento gratuito: linux, programación, open source, bases de datos, android, frameworks, web e informática en general.
En este post vamos a hablar sobre el trabajo en imágenes al usar webpack. A veces, webpack convertirá las imágenes a base64 y en otras ocasiones devolverá la ruta de la misma. Esto se puede configurar de acuerdo a tus necesidades, y justamente veremos cómo hacerlo configurando el url-loader.
Hoy te mostraré cómo crear y configurar un proyecto de Firebase para usarlo en la web con JavaScript usando NPM y Webpack.
Al final vamos a obtener las claves de acceso al proyecto para poder usar el SDK de Firebase en tu aplicación web.
En este corto post te mostraré cómo evitar que los archivos source map sean creados al compilar una app de Vue ejecutando npm run build.
Si has compilado tu aplicación web habrás notado que dentro de dist existen carpetas de js y css que dentro tienen archivos .js.map o .css.map; y si quieres que no se generen hoy te mostraré cómo hacerlo.
Hoy te mostraré cómo deshabilitar el linter de ESLint que normalmente se usa al programar aplicaciones web con JavaScript.
Este linter nos ayuda a tener un código más limpio y ordenado, pero en ocasiones es necesario deshabilitar ESLint temporalmente o en determinadas líneas.
En mi caso quería invocar al depurador (con debugger) y me aparecía el mensaje de: Unexpected ‘debugger’ statement no-debugger.
Obviamente a ti te pueden aparecer otros errores relacionados a este linter llamado ESLint, por eso es que en este post te mostraré cómo deshabilitarlo ya sea por una línea o por un bloque, sin importar el error.
Hoy voy a enseñarte a usar chart.js (librería para crear gráficas en la web) con Vue.js cuando se programa en Webpack con NPM.
Te aviso desde ahora que probablemente esta no sea la manera de vue, es decir, lo haremos como lo haríamos sin usar el framework, pero esto me ha funcionado y te funcionará a ti para no tener tantos problemas al integrar Chart.js con Vue.
Nota: primero te invito a familiarizarte con chart.js, ya que aquí solo te enseñaré a usarlo con Vue a través de webpack con npm.
Nota 2: en febrero de 2023 intenté usar este método y si instalas la última versión tal vez te aparezca un error. Para evitarlo, en el siguiente paso en lugar de usar npm install --save chart.js usa npm install --save chart.js@3.2.1, yo pongo la 3.2.1 porque es la última que me ha funcionado, pero me imagino que mientras sea menor a la 4 todo debería funcionar. La guía está en: https://www.chartjs.org/docs/latest/migration/v4-migration.html
En este post de programación con JavaScript y Vue te enseñaré a importar una librería de NPM a un componente de Vue. Si bien esto es algo muy simple, en ocasiones podemos olvidarnos o perdernos.
Por ello es que en el post de hoy te enseñaré a importar un paquete de NPM desde un componente de Vue y usarlo dentro de ese componente a través de require.
Estoy suponiendo que usas la Vue CLI con Webpack, pero incluso si no lo haces, esto podría darte una ayuda.
Hoy voy a mostrarte cómo usar un if dentro de una plantilla HTML cuando utilizas Webpack, HtmlWebpack o html-webpack.
Concretamente yo estoy usando Webpack con la CLI de Vue y tuve la necesidad de incluir un script de JavaScript solo en el entorno de producción, cosa que fue muy sencilla de hacer con EJS y Webpack.
En este post te mostraré cómo hacer una condicional dependiendo de si estamos en producción o desarrollo dentro de HTML.
En este post te mostraré cómo usar Vue con Laravel, es decir, crear componentes de Vue y usarlos dentro de Laravel, compilando los componentes de Vue que estarán en un archivo con extensión .vue en lugar de usar HTML.
Laravel es un framework del lado del servidor que utiliza el lenguaje PHP. Vue es un framework del lado del cliente que utiliza JavaScript (ya sea con TypeScript, CoffeeScript, etcétera).
Veamos cómo usar estas dos tecnologías en conjunto.