{"id":29151,"date":"2019-01-30T00:00:00","date_gmt":"2019-01-29T23:00:00","guid":{"rendered":"https:\/\/blexin.com\/?p=29151"},"modified":"2021-01-13T09:40:48","modified_gmt":"2021-01-13T08:40:48","slug":"debuggare-angular-in-windows-con-parallels","status":"publish","type":"post","link":"https:\/\/blexin.com\/it\/blog\/debuggare-angular-in-windows-con-parallels\/","title":{"rendered":"Debuggare Angular in Windows con Parallels"},"content":{"rendered":"\n
\"\"<\/figure>\n\n\n\n

La scorsa settimana sono stato contattato da Carmine<\/a>, il nostro consulente di Design e UX, che mi chiedeva supporto per un problema su un progetto Angular. Nello specifico, stava lavorando su un progetto con un backend abbastanza articolato, configurato sul suo Mac e gli erano stati segnalati dei problemi sulla UI, quando l’applicazione era eseguita su Firefox per Windows.<\/p>\n\n\n\n

Dato che non voleva riconfigurare tutto su Windows per risolvere la segnalazione, la sua domanda \u00e8 stata molto semplice: posso lanciare un’applicazione Angular su Mac ed eseguirla su una macchina Windows virtualizzata con Parallels? Per chi non conosce il mondo MAC, Parallels \u00e8 il miglior virtualizzatore a pagamento per MacOS presente sul mercato. Come potete immaginare, la risposta \u00e8 “si”, e la cosa \u00e8 sia semplice che molto utile, soprattutto se dovete testare le vostre applicazioni anche su IE o Edge.<\/p>\n\n\n\n

Quando eseguite un’applicazione generata con la CLI di Angular (ng serve per capirci), questa avvia Angular Live Development Server su localhost:4200:<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Se lavorate con Angular e Docker, probabilmente gi\u00e0 conoscete il parametro –host di ng serve, che serve a indicare l’host su cui il server deve essere in ascolto, il cui default \u00e8 proprio localhost. Per il nostro scopo, possiamo usare l’IP della macchina host, ma, dato che questo pu\u00f2 cambiare spesso, possiamo usare l’indirizzo 0.0.0.0, che indica di rispondere qualsiasi sia l’indirizzo da cui arriva la richiesta:<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Se lanciate Windows su Parallels e aprite Firefox o Edge all’indirizzo della vostra macchina host, porta 4200, vedrete l’applicazione Angular in esecuzione:<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Se cambiate il codice e salvate, vedrete che anche il live reload funziona, cosa che vi permette di testare le modifiche anche su Windows. <\/p>\n\n\n\n

Visto che ci siamo, proviamo anche su IE. Scopriremo che, purtroppo, by default, l’applicazione non funziona…<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Se \u00e8 la prima volta che incrociate questo problema, probabilmente non testate le vostre applicazioni su IE. In realt\u00e0, nel template standard generato dalla CLI, esiste un file chiamato polyfill.ts, che contiene (commentate di default) le operazioni necessarie al funzionamento di Angular su IE9\/IE10\/IE11 e le versioni di Chrome < 5:<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Un polyfill \u00e8 una tecnica che vi permette di emulare delle funzionalit\u00e0 non presenti nei browser pi\u00f9 vecchi. Se avete vissuto il passaggio ad HTML5, probabilmente conoscete la libreria Modernizr<\/a>, la cui inclusione nel progetto permetteva da sola di far riconoscere i nuovi elementi semantici di HTML5.<\/p>\n\n\n\n

Decommentando il codice, installando i pacchetti indicati nel file e leggendo i commenti (in alcuni casi va creato un file a parte per la configurazione di zone.js), l’applicazione funzioner\u00e0 anche su Internet Explorer scendendo fino alla versione 9. Sotto la versione 9, il team non fornisce supporto. Bisogna anche dire che i polyfill impattano sulle performance dell’applicazione, quindi fateci sempre attenzione.<\/p>\n\n\n\n

Happy Coding!<\/p>\n\n\n\n\n","protected":false},"excerpt":{"rendered":"

Come eseguire il debug di applicazioni Angular su Windows da Mac con Parallels<\/p>\n","protected":false},"author":196716248,"featured_media":29152,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_et_pb_use_builder":"off","_et_pb_old_content":"","_et_gb_content_width":"","_coblocks_attr":"","_coblocks_dimensions":"","_coblocks_responsive_height":"","_coblocks_accordion_ie_support":"","_crdt_document":"","inline_featured_image":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_feature_clip_id":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2},"_wpas_customize_per_network":false,"jetpack_post_was_ever_published":false},"categories":[688637374],"tags":[688637387],"class_list":["post-29151","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog","tag-angular"],"yoast_head":"\nDebuggare Angular in Windows con Parallels - Blexin<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/blexin.com\/it\/blog\/debuggare-angular-in-windows-con-parallels\/\" \/>\n<meta property=\"og:locale\" content=\"it_IT\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Debuggare Angular in Windows con Parallels - Blexin\" \/>\n<meta property=\"og:description\" content=\"Come eseguire il debug di applicazioni Angular su Windows da Mac con Parallels\" \/>\n<meta property=\"og:url\" content=\"https:\/\/blexin.com\/it\/blog\/debuggare-angular-in-windows-con-parallels\/\" \/>\n<meta property=\"og:site_name\" content=\"Blexin\" \/>\n<meta property=\"article:published_time\" content=\"2019-01-29T23:00:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-01-13T08:40:48+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/i2.wp.com\/blexin.com\/wp-content\/uploads\/2020\/12\/3cb43969-50ff-4bcb-ab00-f36834fa2cbc.png?fit=1024%2C608&ssl=1\" \/>\n\t<meta property=\"og:image:width\" content=\"1024\" \/>\n\t<meta property=\"og:image:height\" content=\"608\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Michele Aponte\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Scritto da\" \/>\n\t<meta name=\"twitter:data1\" content=\"Michele Aponte\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tempo di lettura stimato\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minuti\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/debuggare-angular-in-windows-con-parallels\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/debuggare-angular-in-windows-con-parallels\\\/\"},\"author\":{\"name\":\"Michele Aponte\",\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/#\\\/schema\\\/person\\\/cdc5540c3b6edcacd8d760669e797005\"},\"headline\":\"Debuggare Angular in Windows con Parallels\",\"datePublished\":\"2019-01-29T23:00:00+00:00\",\"dateModified\":\"2021-01-13T08:40:48+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/debuggare-angular-in-windows-con-parallels\\\/\"},\"wordCount\":470,\"image\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/debuggare-angular-in-windows-con-parallels\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i0.wp.com\\\/blexin.com\\\/wp-content\\\/uploads\\\/2020\\\/12\\\/3cb43969-50ff-4bcb-ab00-f36834fa2cbc.png?fit=1024%2C608&ssl=1\",\"keywords\":[\"Angular\"],\"articleSection\":[\"Blog\"],\"inLanguage\":\"it-IT\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/debuggare-angular-in-windows-con-parallels\\\/\",\"url\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/debuggare-angular-in-windows-con-parallels\\\/\",\"name\":\"Debuggare Angular in Windows con Parallels - Blexin\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/debuggare-angular-in-windows-con-parallels\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/debuggare-angular-in-windows-con-parallels\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i0.wp.com\\\/blexin.com\\\/wp-content\\\/uploads\\\/2020\\\/12\\\/3cb43969-50ff-4bcb-ab00-f36834fa2cbc.png?fit=1024%2C608&ssl=1\",\"datePublished\":\"2019-01-29T23:00:00+00:00\",\"dateModified\":\"2021-01-13T08:40:48+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/#\\\/schema\\\/person\\\/cdc5540c3b6edcacd8d760669e797005\"},\"breadcrumb\":{\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/debuggare-angular-in-windows-con-parallels\\\/#breadcrumb\"},\"inLanguage\":\"it-IT\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/debuggare-angular-in-windows-con-parallels\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"it-IT\",\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/debuggare-angular-in-windows-con-parallels\\\/#primaryimage\",\"url\":\"https:\\\/\\\/i0.wp.com\\\/blexin.com\\\/wp-content\\\/uploads\\\/2020\\\/12\\\/3cb43969-50ff-4bcb-ab00-f36834fa2cbc.png?fit=1024%2C608&ssl=1\",\"contentUrl\":\"https:\\\/\\\/i0.wp.com\\\/blexin.com\\\/wp-content\\\/uploads\\\/2020\\\/12\\\/3cb43969-50ff-4bcb-ab00-f36834fa2cbc.png?fit=1024%2C608&ssl=1\",\"width\":1024,\"height\":608},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/blog\\\/debuggare-angular-in-windows-con-parallels\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/blexin.com\\\/it\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Debuggare Angular in Windows con Parallels\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/#website\",\"url\":\"https:\\\/\\\/blexin.com\\\/it\\\/\",\"name\":\"Blexin\",\"description\":\"Con noi \u00e8 semplice\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/blexin.com\\\/it\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"it-IT\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/blexin.com\\\/it\\\/#\\\/schema\\\/person\\\/cdc5540c3b6edcacd8d760669e797005\",\"name\":\"Michele Aponte\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"it-IT\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/32138aff568f2063b34d27a23cef27e09f3159bfcadea5ea05599c499cf4342f?s=96&d=identicon&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/32138aff568f2063b34d27a23cef27e09f3159bfcadea5ea05599c499cf4342f?s=96&d=identicon&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/32138aff568f2063b34d27a23cef27e09f3159bfcadea5ea05599c499cf4342f?s=96&d=identicon&r=g\",\"caption\":\"Michele Aponte\"},\"url\":\"https:\\\/\\\/blexin.com\\\/it\\\/author\\\/michele-aponteblexin-com\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Debuggare Angular in Windows con Parallels - Blexin","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/blexin.com\/it\/blog\/debuggare-angular-in-windows-con-parallels\/","og_locale":"it_IT","og_type":"article","og_title":"Debuggare Angular in Windows con Parallels - Blexin","og_description":"Come eseguire il debug di applicazioni Angular su Windows da Mac con Parallels","og_url":"https:\/\/blexin.com\/it\/blog\/debuggare-angular-in-windows-con-parallels\/","og_site_name":"Blexin","article_published_time":"2019-01-29T23:00:00+00:00","article_modified_time":"2021-01-13T08:40:48+00:00","og_image":[{"width":1024,"height":608,"url":"https:\/\/i2.wp.com\/blexin.com\/wp-content\/uploads\/2020\/12\/3cb43969-50ff-4bcb-ab00-f36834fa2cbc.png?fit=1024%2C608&ssl=1","type":"image\/png"}],"author":"Michele Aponte","twitter_card":"summary_large_image","twitter_misc":{"Scritto da":"Michele Aponte","Tempo di lettura stimato":"2 minuti"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/blexin.com\/it\/blog\/debuggare-angular-in-windows-con-parallels\/#article","isPartOf":{"@id":"https:\/\/blexin.com\/it\/blog\/debuggare-angular-in-windows-con-parallels\/"},"author":{"name":"Michele Aponte","@id":"https:\/\/blexin.com\/it\/#\/schema\/person\/cdc5540c3b6edcacd8d760669e797005"},"headline":"Debuggare Angular in Windows con Parallels","datePublished":"2019-01-29T23:00:00+00:00","dateModified":"2021-01-13T08:40:48+00:00","mainEntityOfPage":{"@id":"https:\/\/blexin.com\/it\/blog\/debuggare-angular-in-windows-con-parallels\/"},"wordCount":470,"image":{"@id":"https:\/\/blexin.com\/it\/blog\/debuggare-angular-in-windows-con-parallels\/#primaryimage"},"thumbnailUrl":"https:\/\/i0.wp.com\/blexin.com\/wp-content\/uploads\/2020\/12\/3cb43969-50ff-4bcb-ab00-f36834fa2cbc.png?fit=1024%2C608&ssl=1","keywords":["Angular"],"articleSection":["Blog"],"inLanguage":"it-IT"},{"@type":"WebPage","@id":"https:\/\/blexin.com\/it\/blog\/debuggare-angular-in-windows-con-parallels\/","url":"https:\/\/blexin.com\/it\/blog\/debuggare-angular-in-windows-con-parallels\/","name":"Debuggare Angular in Windows con Parallels - Blexin","isPartOf":{"@id":"https:\/\/blexin.com\/it\/#website"},"primaryImageOfPage":{"@id":"https:\/\/blexin.com\/it\/blog\/debuggare-angular-in-windows-con-parallels\/#primaryimage"},"image":{"@id":"https:\/\/blexin.com\/it\/blog\/debuggare-angular-in-windows-con-parallels\/#primaryimage"},"thumbnailUrl":"https:\/\/i0.wp.com\/blexin.com\/wp-content\/uploads\/2020\/12\/3cb43969-50ff-4bcb-ab00-f36834fa2cbc.png?fit=1024%2C608&ssl=1","datePublished":"2019-01-29T23:00:00+00:00","dateModified":"2021-01-13T08:40:48+00:00","author":{"@id":"https:\/\/blexin.com\/it\/#\/schema\/person\/cdc5540c3b6edcacd8d760669e797005"},"breadcrumb":{"@id":"https:\/\/blexin.com\/it\/blog\/debuggare-angular-in-windows-con-parallels\/#breadcrumb"},"inLanguage":"it-IT","potentialAction":[{"@type":"ReadAction","target":["https:\/\/blexin.com\/it\/blog\/debuggare-angular-in-windows-con-parallels\/"]}]},{"@type":"ImageObject","inLanguage":"it-IT","@id":"https:\/\/blexin.com\/it\/blog\/debuggare-angular-in-windows-con-parallels\/#primaryimage","url":"https:\/\/i0.wp.com\/blexin.com\/wp-content\/uploads\/2020\/12\/3cb43969-50ff-4bcb-ab00-f36834fa2cbc.png?fit=1024%2C608&ssl=1","contentUrl":"https:\/\/i0.wp.com\/blexin.com\/wp-content\/uploads\/2020\/12\/3cb43969-50ff-4bcb-ab00-f36834fa2cbc.png?fit=1024%2C608&ssl=1","width":1024,"height":608},{"@type":"BreadcrumbList","@id":"https:\/\/blexin.com\/it\/blog\/debuggare-angular-in-windows-con-parallels\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/blexin.com\/it\/"},{"@type":"ListItem","position":2,"name":"Debuggare Angular in Windows con Parallels"}]},{"@type":"WebSite","@id":"https:\/\/blexin.com\/it\/#website","url":"https:\/\/blexin.com\/it\/","name":"Blexin","description":"Con noi \u00e8 semplice","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/blexin.com\/it\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"it-IT"},{"@type":"Person","@id":"https:\/\/blexin.com\/it\/#\/schema\/person\/cdc5540c3b6edcacd8d760669e797005","name":"Michele Aponte","image":{"@type":"ImageObject","inLanguage":"it-IT","@id":"https:\/\/secure.gravatar.com\/avatar\/32138aff568f2063b34d27a23cef27e09f3159bfcadea5ea05599c499cf4342f?s=96&d=identicon&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/32138aff568f2063b34d27a23cef27e09f3159bfcadea5ea05599c499cf4342f?s=96&d=identicon&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/32138aff568f2063b34d27a23cef27e09f3159bfcadea5ea05599c499cf4342f?s=96&d=identicon&r=g","caption":"Michele Aponte"},"url":"https:\/\/blexin.com\/it\/author\/michele-aponteblexin-com\/"}]}},"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/blexin.com\/wp-content\/uploads\/2020\/12\/3cb43969-50ff-4bcb-ab00-f36834fa2cbc.png?fit=1024%2C608&ssl=1","jetpack_shortlink":"https:\/\/wp.me\/pcyUBx-7Ab","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/posts\/29151","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/users\/196716248"}],"replies":[{"embeddable":true,"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/comments?post=29151"}],"version-history":[{"count":7,"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/posts\/29151\/revisions"}],"predecessor-version":[{"id":29176,"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/posts\/29151\/revisions\/29176"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/media\/29152"}],"wp:attachment":[{"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/media?parent=29151"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/categories?post=29151"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blexin.com\/it\/wp-json\/wp\/v2\/tags?post=29151"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}