Entradas

16 A real application (1) App skeleton

Imagen
 The application is for the simple management of a cemetery. 1. The basics. Installation Install VS Code, npm and nodejs.  Install "Live Server" in VS Code. Press Control-P and copy "ext install ritwickdey.LiveServer" Open VS Code and execute these commands in the terminal window as mentioned in a previous post # create the project folder mkdir webpack-jq cd webpack-jq # create the package.json and ask for project basic info npm init -y # install webpack and cli (opt -D is equivalent to --save-dev ) npm i -D webpack webpack-cli # create the folder src (sources folder) mkdir src #create the index.js empty file touch src/index.js # execute webpack (and complains about no mode selected (development or production) npx webpack # install the ts compiler and ts-loader for webpack npm i --save-dev typescript ts-loader # create the file tsconfig.json npx tsc --init # import the jquery modules from the node repo npm i -D jquery @types/jquery # import the jquery-...
Publicar un comentario
Leer más

15 Typescript (3) json ..

 Credits Makigas Ariel Bautista Academind Peter Lehnhhardt  (Stack Overflow) Jurgen Van Moere-Understanding Modules Neoguias-webapck   Swashbuckling with Code  (webpack & ts) npm install lite-server --save-dev package.json -> "scripts":[ .... "start":"lite-server" Find index.html    in tsconfig,json "resolveJsonModule" : true , json data (menu.json) [ { "key" : "hola" , "translation" : [ "hola" , "hola" , "hello" , "Hallo" ]}, { "key" : "now" , "translation" : [ "ahora" , "ara" , "now" , "alssecspiken" ]} ] a module for reading json (index.ts) import menu from "../data-i18n/i18n-menu.json" import field from "../data-i18n/i18n-field.json" console . log ( menu [ 0 ]. key ); console . log ( menu [ 0 ]. translation [ 0 ]); console . log ( menu [ 1 ]. key ); consol...
Publicar un comentario
Leer más

14 Typescript (2) with jquery, bootstrap and other module stuff

Imagen
1. Introduction Modules are rather tedious and difficult to be understood. There are many module types (Commonjs, AMD, UMD, System) as Jurgen Van Moere explains.  Node, however, works well with Commonjs modules but cannot integrate well with other modules (AMD, System..) Webpack comes to the rescue, but it is a bit difficult to use. With the help of some sites like Neoguias  and  Swashbuckling  this task is much more easier. Our schedule is: Create the basics Create a simple web page with html and javascript Creating a simple module Importing and using a simple node module (is-what) and @types Importing and using jquery 1. The basics. Installation Open VS Code and execute these commands in the terminal window # create the project folder mkdir webpack-jq cd webpack-jq # create the package.json and ask for project basic info npm init -y # install webpack and cli (opt -D is equivalent to --save-dev ) npm i -D webpack webpack-cli # create the folder src (source...
Publicar un comentario
Leer más