[{"data":1,"prerenderedAt":5499},["Reactive",2],{"content-vue-into-the-laravel-verse":3,"content-query-K4rBjse5qS":2973},{"_path":4,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":8,"description":9,"published":10,"category":11,"metaTitle":8,"metaDesc":8,"date":12,"created-at":12,"updated-at":12,"tags":13,"keywords":21,"image":23,"id":24,"readingTime":25,"body":30,"_type":2968,"_id":2969,"_source":2970,"_file":2971,"_extension":2972},"/stories/vue-into-the-laravel-verse","stories",false,"","Vue into the Laravel Verse","In this story, I'll show my journey about add Vue to Laravel and how to set up Vue Router. And I'll explain\nhow things work behind the scene as I go.",true,"Frontend","2023-10-15T00:00:00.000Z",[14,15,16,17,18,19,20],"frontend","backend","vue","laravel","routing","vite","blades",[14,15,16,17,18,19,22],"blade","https://acrossverse.dev/images/blog/Vue-into-the-laravel-verse.png",3,{"text":26,"minutes":27,"time":28,"words":29},"8 min read",7.06,423600,1412,{"type":31,"children":32,"toc":2943},"root",[33,41,46,52,57,63,92,97,115,126,132,137,162,168,175,307,322,328,355,361,394,403,415,420,439,452,648,660,666,699,868,873,879,892,1050,1055,1069,1090,1096,1148,1238,1331,1337,1350,1511,1517,1544,1549,1607,1613,1618,1670,1830,1836,1848,1866,1872,1943,1997,2009,2061,2087,2131,2137,2142,2158,2164,2183,2189,2216,2229,2666,2671,2684,2831,2837,2901,2916,2922,2937],{"type":34,"tag":35,"props":36,"children":38},"element","h1",{"id":37},"vue-into-the-laravel-verse",[39],{"type":40,"value":8},"text",{"type":34,"tag":42,"props":43,"children":44},"p",{},[45],{"type":40,"value":9},{"type":34,"tag":47,"props":48,"children":49},"h2",{"id":17},[50],{"type":40,"value":51},"Laravel",{"type":34,"tag":42,"props":53,"children":54},{},[55],{"type":40,"value":56},"Laravel is a powerful backend framework that offers a wide array of features necessary for building modern web\napplications and APIs. These features include routing, validation, caching, queues, file storage, database migrations,\nand much more.",{"type":34,"tag":47,"props":58,"children":60},{"id":59},"laravel-blades",[61],{"type":40,"value":62},"Laravel blades",{"type":34,"tag":42,"props":64,"children":65},{},[66,68,73,75,81,83,90],{"type":40,"value":67},"Laravel by default uses ",{"type":34,"tag":69,"props":70,"children":71},"strong",{},[72],{"type":40,"value":20},{"type":40,"value":74}," ",{"type":34,"tag":76,"props":77,"children":78},"em",{},[79],{"type":40,"value":80},"templating language",{"type":40,"value":82},", that provide short syntax for displaying data,\niterating over data, conditional statements, authentication directives, and many other features. Blade template files\nuse the ",{"type":34,"tag":84,"props":85,"children":87},"code",{"className":86},[],[88],{"type":40,"value":89},".blade.php",{"type":40,"value":91}," file extension and they are complied into plain PHP in the end.",{"type":34,"tag":47,"props":93,"children":94},{"id":16},[95],{"type":40,"value":96},"Vue",{"type":34,"tag":42,"props":98,"children":99},{},[100,102,106,108,113],{"type":40,"value":101},"In the ",{"type":34,"tag":69,"props":103,"children":104},{},[105],{"type":40,"value":96},{"type":40,"value":107}," main page you will find this big title ",{"type":34,"tag":69,"props":109,"children":110},{},[111],{"type":40,"value":112},"The Progressive JavaScript Framework",{"type":40,"value":114},", but what is a\nprogressive framework?",{"type":34,"tag":42,"props":116,"children":117},{},[118,120,124],{"type":40,"value":119},"Vue.js allows developers to adopt its features gradually. You can start by adding Vue to a small part of your project or\nan individual component without the need to rewrite your entire application (if it's already written in ",{"type":34,"tag":69,"props":121,"children":122},{},[123],{"type":40,"value":20},{"type":40,"value":125}," or\nsomething else). This flexibility is particularly useful when you want to modernize or improve the interactivity of\nexisting web applications.",{"type":34,"tag":47,"props":127,"children":129},{"id":128},"vue-with-laravel",[130],{"type":40,"value":131},"Vue with laravel",{"type":34,"tag":42,"props":133,"children":134},{},[135],{"type":40,"value":136},"So why we would use Vue with laravel instead of creating a separate frontend project? Here are a few reasons:",{"type":34,"tag":138,"props":139,"children":140},"ul",{},[141,147,152,157],{"type":34,"tag":142,"props":143,"children":144},"li",{},[145],{"type":40,"value":146},"Create a full-stack workflow.",{"type":34,"tag":142,"props":148,"children":149},{},[150],{"type":40,"value":151},"The source code is combined into one project, rather than having separate projects for the backend and frontend.",{"type":34,"tag":142,"props":153,"children":154},{},[155],{"type":40,"value":156},"Pass props from your blade files into your Vue components.",{"type":34,"tag":142,"props":158,"children":159},{},[160],{"type":40,"value":161},"Dseploy both frameworks together in a single run.",{"type":34,"tag":47,"props":163,"children":165},{"id":164},"getting-started",[166],{"type":40,"value":167},"Getting Started",{"type":34,"tag":169,"props":170,"children":172},"h3",{"id":171},"create-a-new-laravel-project",[173],{"type":40,"value":174},"Create a new laravel project",{"type":34,"tag":176,"props":177,"children":181},"pre",{"className":178,"code":179,"language":180,"meta":7,"style":7},"language-shell shiki shiki-themes github-dark-default","> composer create-project laravel/laravel laravel-vue\n> cd laravel-vue\n\n# install the javascript libraries and dependencies needed for our project\n> npm install\n\n# run the backend server\n> php artisan serve\n\n# run the frontend server, watch changes in your js assets\n> npm run dev\n","shell",[182],{"type":34,"tag":84,"props":183,"children":184},{"__ignoreMap":7},[185,203,216,224,234,247,255,264,277,285,294],{"type":34,"tag":186,"props":187,"children":190},"span",{"class":188,"line":189},"line",1,[191,197],{"type":34,"tag":186,"props":192,"children":194},{"style":193},"--shiki-default:#FF7B72",[195],{"type":40,"value":196},">",{"type":34,"tag":186,"props":198,"children":200},{"style":199},"--shiki-default:#E6EDF3",[201],{"type":40,"value":202}," composer create-project laravel/laravel laravel-vue\n",{"type":34,"tag":186,"props":204,"children":206},{"class":188,"line":205},2,[207,211],{"type":34,"tag":186,"props":208,"children":209},{"style":193},[210],{"type":40,"value":196},{"type":34,"tag":186,"props":212,"children":213},{"style":199},[214],{"type":40,"value":215}," cd laravel-vue\n",{"type":34,"tag":186,"props":217,"children":218},{"class":188,"line":24},[219],{"type":34,"tag":186,"props":220,"children":221},{"emptyLinePlaceholder":10},[222],{"type":40,"value":223},"\n",{"type":34,"tag":186,"props":225,"children":227},{"class":188,"line":226},4,[228],{"type":34,"tag":186,"props":229,"children":231},{"style":230},"--shiki-default:#8B949E",[232],{"type":40,"value":233},"# install the javascript libraries and dependencies needed for our project\n",{"type":34,"tag":186,"props":235,"children":237},{"class":188,"line":236},5,[238,242],{"type":34,"tag":186,"props":239,"children":240},{"style":193},[241],{"type":40,"value":196},{"type":34,"tag":186,"props":243,"children":244},{"style":199},[245],{"type":40,"value":246}," npm install\n",{"type":34,"tag":186,"props":248,"children":250},{"class":188,"line":249},6,[251],{"type":34,"tag":186,"props":252,"children":253},{"emptyLinePlaceholder":10},[254],{"type":40,"value":223},{"type":34,"tag":186,"props":256,"children":258},{"class":188,"line":257},7,[259],{"type":34,"tag":186,"props":260,"children":261},{"style":230},[262],{"type":40,"value":263},"# run the backend server\n",{"type":34,"tag":186,"props":265,"children":267},{"class":188,"line":266},8,[268,272],{"type":34,"tag":186,"props":269,"children":270},{"style":193},[271],{"type":40,"value":196},{"type":34,"tag":186,"props":273,"children":274},{"style":199},[275],{"type":40,"value":276}," php artisan serve\n",{"type":34,"tag":186,"props":278,"children":280},{"class":188,"line":279},9,[281],{"type":34,"tag":186,"props":282,"children":283},{"emptyLinePlaceholder":10},[284],{"type":40,"value":223},{"type":34,"tag":186,"props":286,"children":288},{"class":188,"line":287},10,[289],{"type":34,"tag":186,"props":290,"children":291},{"style":230},[292],{"type":40,"value":293},"# run the frontend server, watch changes in your js assets\n",{"type":34,"tag":186,"props":295,"children":297},{"class":188,"line":296},11,[298,302],{"type":34,"tag":186,"props":299,"children":300},{"style":193},[301],{"type":40,"value":196},{"type":34,"tag":186,"props":303,"children":304},{"style":199},[305],{"type":40,"value":306}," npm run dev\n",{"type":34,"tag":42,"props":308,"children":309},{},[310,312,320],{"type":40,"value":311},"Your server is now up and running at ",{"type":34,"tag":313,"props":314,"children":318},"a",{"href":315,"rel":316},"http://127.0.0.1:8000/",[317],"nofollow",[319],{"type":40,"value":315},{"type":40,"value":321},".",{"type":34,"tag":169,"props":323,"children":325},{"id":324},"install-vuejs",[326],{"type":40,"value":327},"Install vue.js",{"type":34,"tag":176,"props":329,"children":331},{"className":178,"code":330,"language":180,"meta":7,"style":7},"# The Sass package is optional; you can install it if needed.\n> npm install --save-dev vue sass\n",[332],{"type":34,"tag":84,"props":333,"children":334},{"__ignoreMap":7},[335,343],{"type":34,"tag":186,"props":336,"children":337},{"class":188,"line":189},[338],{"type":34,"tag":186,"props":339,"children":340},{"style":230},[341],{"type":40,"value":342},"# The Sass package is optional; you can install it if needed.\n",{"type":34,"tag":186,"props":344,"children":345},{"class":188,"line":205},[346,350],{"type":34,"tag":186,"props":347,"children":348},{"style":193},[349],{"type":40,"value":196},{"type":34,"tag":186,"props":351,"children":352},{"style":199},[353],{"type":40,"value":354}," npm install --save-dev vue sass\n",{"type":34,"tag":169,"props":356,"children":358},{"id":357},"configure-vite",[359],{"type":40,"value":360},"Configure vite",{"type":34,"tag":362,"props":363,"children":364},"callout",{},[365],{"type":34,"tag":42,"props":366,"children":367},{},[368,370,376,378,384,386,392],{"type":40,"value":369},"Note: ",{"type":34,"tag":84,"props":371,"children":373},{"className":372},[],[374],{"type":40,"value":375},"Vite",{"type":40,"value":377}," is installed by default with new versions of Laravel, If you have an old existing project it may\nhave ",{"type":34,"tag":84,"props":379,"children":381},{"className":380},[],[382],{"type":40,"value":383},"Webpack",{"type":40,"value":385}," instead, so double-check your ",{"type":34,"tag":84,"props":387,"children":389},{"className":388},[],[390],{"type":40,"value":391},"package.json",{"type":40,"value":393}," for Vite first.",{"type":34,"tag":42,"props":395,"children":396},{},[397,401],{"type":34,"tag":69,"props":398,"children":399},{},[400],{"type":40,"value":375},{"type":40,"value":402}," used to bundle your application's CSS, HTML and Javascript into a production ready assets. It could be used\nwith multiple frameworks, not just Vue, even with apps built without any framework.",{"type":34,"tag":42,"props":404,"children":405},{},[406,408,413],{"type":40,"value":407},"Vite's ",{"type":34,"tag":69,"props":409,"children":410},{},[411],{"type":40,"value":412},"plugins",{"type":40,"value":414}," are used to extend the functionality of Vite and integrate it with many other tools and frameworks,\nincluding Vue.",{"type":34,"tag":42,"props":416,"children":417},{},[418],{"type":40,"value":419},"First, Let's install the Vite's Vue plugin:",{"type":34,"tag":176,"props":421,"children":423},{"className":178,"code":422,"language":180,"meta":7,"style":7},"> npm install --save-dev @vitejs/plugin-vue\n",[424],{"type":34,"tag":84,"props":425,"children":426},{"__ignoreMap":7},[427],{"type":34,"tag":186,"props":428,"children":429},{"class":188,"line":189},[430,434],{"type":34,"tag":186,"props":431,"children":432},{"style":193},[433],{"type":40,"value":196},{"type":34,"tag":186,"props":435,"children":436},{"style":199},[437],{"type":40,"value":438}," npm install --save-dev @vitejs/plugin-vue\n",{"type":34,"tag":42,"props":440,"children":441},{},[442,444,450],{"type":40,"value":443},"Let's change ",{"type":34,"tag":84,"props":445,"children":447},{"className":446},[],[448],{"type":40,"value":449},"vite.config.js",{"type":40,"value":451}," to add the Vue plugin.",{"type":34,"tag":176,"props":453,"children":457},{"className":454,"code":455,"language":456,"meta":7,"style":7},"language-js shiki shiki-themes github-dark-default","// vite.config.js\n\nimport vue from '@vitejs/plugin-vue';\n\nexport default defineConfig({\n  plugins: [\n    // ... laravel plugin and other existing plugins here ...\n    vue({}),\n  ],\n  resolve: {\n    alias: {\n      vue: 'vue/dist/vue.esm-bundler.js',\n    },\n  },\n});\n","js",[458],{"type":34,"tag":84,"props":459,"children":460},{"__ignoreMap":7},[461,469,476,505,512,537,545,553,566,579,587,595,613,622,635],{"type":34,"tag":186,"props":462,"children":463},{"class":188,"line":189},[464],{"type":34,"tag":186,"props":465,"children":466},{"style":230},[467],{"type":40,"value":468},"// vite.config.js\n",{"type":34,"tag":186,"props":470,"children":471},{"class":188,"line":205},[472],{"type":34,"tag":186,"props":473,"children":474},{"emptyLinePlaceholder":10},[475],{"type":40,"value":223},{"type":34,"tag":186,"props":477,"children":478},{"class":188,"line":24},[479,484,489,494,500],{"type":34,"tag":186,"props":480,"children":481},{"style":193},[482],{"type":40,"value":483},"import",{"type":34,"tag":186,"props":485,"children":486},{"style":199},[487],{"type":40,"value":488}," vue ",{"type":34,"tag":186,"props":490,"children":491},{"style":193},[492],{"type":40,"value":493},"from",{"type":34,"tag":186,"props":495,"children":497},{"style":496},"--shiki-default:#A5D6FF",[498],{"type":40,"value":499}," '@vitejs/plugin-vue'",{"type":34,"tag":186,"props":501,"children":502},{"style":199},[503],{"type":40,"value":504},";\n",{"type":34,"tag":186,"props":506,"children":507},{"class":188,"line":226},[508],{"type":34,"tag":186,"props":509,"children":510},{"emptyLinePlaceholder":10},[511],{"type":40,"value":223},{"type":34,"tag":186,"props":513,"children":514},{"class":188,"line":236},[515,520,525,531],{"type":34,"tag":186,"props":516,"children":517},{"style":193},[518],{"type":40,"value":519},"export",{"type":34,"tag":186,"props":521,"children":522},{"style":193},[523],{"type":40,"value":524}," default",{"type":34,"tag":186,"props":526,"children":528},{"style":527},"--shiki-default:#D2A8FF",[529],{"type":40,"value":530}," defineConfig",{"type":34,"tag":186,"props":532,"children":534},{"style":533},"--shiki-default:#FFA657",[535],{"type":40,"value":536},"({\n",{"type":34,"tag":186,"props":538,"children":539},{"class":188,"line":249},[540],{"type":34,"tag":186,"props":541,"children":542},{"style":199},[543],{"type":40,"value":544},"  plugins: [\n",{"type":34,"tag":186,"props":546,"children":547},{"class":188,"line":257},[548],{"type":34,"tag":186,"props":549,"children":550},{"style":230},[551],{"type":40,"value":552},"    // ... laravel plugin and other existing plugins here ...\n",{"type":34,"tag":186,"props":554,"children":555},{"class":188,"line":266},[556,561],{"type":34,"tag":186,"props":557,"children":558},{"style":527},[559],{"type":40,"value":560},"    vue",{"type":34,"tag":186,"props":562,"children":563},{"style":199},[564],{"type":40,"value":565},"({}),\n",{"type":34,"tag":186,"props":567,"children":568},{"class":188,"line":279},[569,574],{"type":34,"tag":186,"props":570,"children":571},{"style":199},[572],{"type":40,"value":573},"  ]",{"type":34,"tag":186,"props":575,"children":576},{"style":533},[577],{"type":40,"value":578},",\n",{"type":34,"tag":186,"props":580,"children":581},{"class":188,"line":287},[582],{"type":34,"tag":186,"props":583,"children":584},{"style":199},[585],{"type":40,"value":586},"  resolve: {\n",{"type":34,"tag":186,"props":588,"children":589},{"class":188,"line":296},[590],{"type":34,"tag":186,"props":591,"children":592},{"style":199},[593],{"type":40,"value":594},"    alias: {\n",{"type":34,"tag":186,"props":596,"children":598},{"class":188,"line":597},12,[599,604,609],{"type":34,"tag":186,"props":600,"children":601},{"style":199},[602],{"type":40,"value":603},"      vue: ",{"type":34,"tag":186,"props":605,"children":606},{"style":496},[607],{"type":40,"value":608},"'vue/dist/vue.esm-bundler.js'",{"type":34,"tag":186,"props":610,"children":611},{"style":199},[612],{"type":40,"value":578},{"type":34,"tag":186,"props":614,"children":616},{"class":188,"line":615},13,[617],{"type":34,"tag":186,"props":618,"children":619},{"style":199},[620],{"type":40,"value":621},"    },\n",{"type":34,"tag":186,"props":623,"children":625},{"class":188,"line":624},14,[626,631],{"type":34,"tag":186,"props":627,"children":628},{"style":199},[629],{"type":40,"value":630},"  }",{"type":34,"tag":186,"props":632,"children":633},{"style":533},[634],{"type":40,"value":578},{"type":34,"tag":186,"props":636,"children":638},{"class":188,"line":637},15,[639,644],{"type":34,"tag":186,"props":640,"children":641},{"style":533},[642],{"type":40,"value":643},"})",{"type":34,"tag":186,"props":645,"children":646},{"style":199},[647],{"type":40,"value":504},{"type":34,"tag":42,"props":649,"children":650},{},[651,653],{"type":40,"value":652},"For more advanced configurations, refer\nto ",{"type":34,"tag":313,"props":654,"children":657},{"href":655,"rel":656},"https://github.com/vitejs/vite-plugin-vue/tree/main/packages/plugin-vue",[317],[658],{"type":40,"value":659},"the Vite Vue plugin documentation.",{"type":34,"tag":169,"props":661,"children":663},{"id":662},"configure-webpack-optional",[664],{"type":40,"value":665},"Configure webpack (optional)",{"type":34,"tag":42,"props":667,"children":668},{},[669,671,676,678,683,685,691,693,698],{"type":40,"value":670},"If you have old Laravel project, you won't find ",{"type":34,"tag":84,"props":672,"children":674},{"className":673},[],[675],{"type":40,"value":375},{"type":40,"value":677}," installed, another popular bundling package\ncalled ",{"type":34,"tag":84,"props":679,"children":681},{"className":680},[],[682],{"type":40,"value":383},{"type":40,"value":684}," was used instead. So we need to add the configure vue inside ",{"type":34,"tag":84,"props":686,"children":688},{"className":687},[],[689],{"type":40,"value":690},"webpack.mix.js",{"type":40,"value":692}," instead\nof ",{"type":34,"tag":84,"props":694,"children":696},{"className":695},[],[697],{"type":40,"value":449},{"type":40,"value":321},{"type":34,"tag":176,"props":700,"children":702},{"className":454,"code":701,"language":456,"meta":7,"style":7},"const mix = require('laravel-mix');\n\nmix\n  .js('resources/js/app.js', 'public/js')\n  .vue() // \u003C- Add this\n  .postCss('resources/css/app.css', 'public/css', [\n    // ...\n  ]);\n",[703],{"type":34,"tag":84,"props":704,"children":705},{"__ignoreMap":7},[706,745,752,760,796,817,852,860],{"type":34,"tag":186,"props":707,"children":708},{"class":188,"line":189},[709,714,720,725,730,735,740],{"type":34,"tag":186,"props":710,"children":711},{"style":193},[712],{"type":40,"value":713},"const",{"type":34,"tag":186,"props":715,"children":717},{"style":716},"--shiki-default:#79C0FF",[718],{"type":40,"value":719}," mix",{"type":34,"tag":186,"props":721,"children":722},{"style":193},[723],{"type":40,"value":724}," =",{"type":34,"tag":186,"props":726,"children":727},{"style":527},[728],{"type":40,"value":729}," require",{"type":34,"tag":186,"props":731,"children":732},{"style":199},[733],{"type":40,"value":734},"(",{"type":34,"tag":186,"props":736,"children":737},{"style":496},[738],{"type":40,"value":739},"'laravel-mix'",{"type":34,"tag":186,"props":741,"children":742},{"style":199},[743],{"type":40,"value":744},");\n",{"type":34,"tag":186,"props":746,"children":747},{"class":188,"line":205},[748],{"type":34,"tag":186,"props":749,"children":750},{"emptyLinePlaceholder":10},[751],{"type":40,"value":223},{"type":34,"tag":186,"props":753,"children":754},{"class":188,"line":24},[755],{"type":34,"tag":186,"props":756,"children":757},{"style":199},[758],{"type":40,"value":759},"mix\n",{"type":34,"tag":186,"props":761,"children":762},{"class":188,"line":226},[763,768,772,776,781,786,791],{"type":34,"tag":186,"props":764,"children":765},{"style":199},[766],{"type":40,"value":767},"  .",{"type":34,"tag":186,"props":769,"children":770},{"style":527},[771],{"type":40,"value":456},{"type":34,"tag":186,"props":773,"children":774},{"style":199},[775],{"type":40,"value":734},{"type":34,"tag":186,"props":777,"children":778},{"style":496},[779],{"type":40,"value":780},"'resources/js/app.js'",{"type":34,"tag":186,"props":782,"children":783},{"style":199},[784],{"type":40,"value":785},", ",{"type":34,"tag":186,"props":787,"children":788},{"style":496},[789],{"type":40,"value":790},"'public/js'",{"type":34,"tag":186,"props":792,"children":793},{"style":199},[794],{"type":40,"value":795},")\n",{"type":34,"tag":186,"props":797,"children":798},{"class":188,"line":236},[799,803,807,812],{"type":34,"tag":186,"props":800,"children":801},{"style":199},[802],{"type":40,"value":767},{"type":34,"tag":186,"props":804,"children":805},{"style":527},[806],{"type":40,"value":16},{"type":34,"tag":186,"props":808,"children":809},{"style":199},[810],{"type":40,"value":811},"() ",{"type":34,"tag":186,"props":813,"children":814},{"style":230},[815],{"type":40,"value":816},"// \u003C- Add this\n",{"type":34,"tag":186,"props":818,"children":819},{"class":188,"line":249},[820,824,829,833,838,842,847],{"type":34,"tag":186,"props":821,"children":822},{"style":199},[823],{"type":40,"value":767},{"type":34,"tag":186,"props":825,"children":826},{"style":527},[827],{"type":40,"value":828},"postCss",{"type":34,"tag":186,"props":830,"children":831},{"style":199},[832],{"type":40,"value":734},{"type":34,"tag":186,"props":834,"children":835},{"style":496},[836],{"type":40,"value":837},"'resources/css/app.css'",{"type":34,"tag":186,"props":839,"children":840},{"style":199},[841],{"type":40,"value":785},{"type":34,"tag":186,"props":843,"children":844},{"style":496},[845],{"type":40,"value":846},"'public/css'",{"type":34,"tag":186,"props":848,"children":849},{"style":199},[850],{"type":40,"value":851},", [\n",{"type":34,"tag":186,"props":853,"children":854},{"class":188,"line":257},[855],{"type":34,"tag":186,"props":856,"children":857},{"style":230},[858],{"type":40,"value":859},"    // ...\n",{"type":34,"tag":186,"props":861,"children":862},{"class":188,"line":266},[863],{"type":34,"tag":186,"props":864,"children":865},{"style":199},[866],{"type":40,"value":867},"  ]);\n",{"type":34,"tag":42,"props":869,"children":870},{},[871],{"type":40,"value":872},"Ok, we're now done with all installations and configurations.",{"type":34,"tag":169,"props":874,"children":876},{"id":875},"create-a-vue-app-instance",[877],{"type":40,"value":878},"Create a vue app instance",{"type":34,"tag":42,"props":880,"children":881},{},[882,884,890],{"type":40,"value":883},"Now, let's modify the ",{"type":34,"tag":84,"props":885,"children":887},{"className":886},[],[888],{"type":40,"value":889},"/resources/app.js",{"type":40,"value":891}," file to create our Vue app instance, and register your components to it. Any\ncomponents registered here will be avaiable globally to use anywhere in your Vue app.",{"type":34,"tag":176,"props":893,"children":895},{"className":454,"code":894,"language":456,"meta":7,"style":7},"import './bootstrap';\nimport { createApp } from 'vue';\nimport VueApp from './components/VueApp.vue';\n\nconst app = createApp({});\napp.component('vue-app', VueApp);\napp.mount('#app');\n",[896],{"type":34,"tag":84,"props":897,"children":898},{"__ignoreMap":7},[899,915,940,965,972,998,1025],{"type":34,"tag":186,"props":900,"children":901},{"class":188,"line":189},[902,906,911],{"type":34,"tag":186,"props":903,"children":904},{"style":193},[905],{"type":40,"value":483},{"type":34,"tag":186,"props":907,"children":908},{"style":496},[909],{"type":40,"value":910}," './bootstrap'",{"type":34,"tag":186,"props":912,"children":913},{"style":199},[914],{"type":40,"value":504},{"type":34,"tag":186,"props":916,"children":917},{"class":188,"line":205},[918,922,927,931,936],{"type":34,"tag":186,"props":919,"children":920},{"style":193},[921],{"type":40,"value":483},{"type":34,"tag":186,"props":923,"children":924},{"style":199},[925],{"type":40,"value":926}," { createApp } ",{"type":34,"tag":186,"props":928,"children":929},{"style":193},[930],{"type":40,"value":493},{"type":34,"tag":186,"props":932,"children":933},{"style":496},[934],{"type":40,"value":935}," 'vue'",{"type":34,"tag":186,"props":937,"children":938},{"style":199},[939],{"type":40,"value":504},{"type":34,"tag":186,"props":941,"children":942},{"class":188,"line":24},[943,947,952,956,961],{"type":34,"tag":186,"props":944,"children":945},{"style":193},[946],{"type":40,"value":483},{"type":34,"tag":186,"props":948,"children":949},{"style":199},[950],{"type":40,"value":951}," VueApp ",{"type":34,"tag":186,"props":953,"children":954},{"style":193},[955],{"type":40,"value":493},{"type":34,"tag":186,"props":957,"children":958},{"style":496},[959],{"type":40,"value":960}," './components/VueApp.vue'",{"type":34,"tag":186,"props":962,"children":963},{"style":199},[964],{"type":40,"value":504},{"type":34,"tag":186,"props":966,"children":967},{"class":188,"line":226},[968],{"type":34,"tag":186,"props":969,"children":970},{"emptyLinePlaceholder":10},[971],{"type":40,"value":223},{"type":34,"tag":186,"props":973,"children":974},{"class":188,"line":236},[975,979,984,988,993],{"type":34,"tag":186,"props":976,"children":977},{"style":193},[978],{"type":40,"value":713},{"type":34,"tag":186,"props":980,"children":981},{"style":716},[982],{"type":40,"value":983}," app",{"type":34,"tag":186,"props":985,"children":986},{"style":193},[987],{"type":40,"value":724},{"type":34,"tag":186,"props":989,"children":990},{"style":527},[991],{"type":40,"value":992}," createApp",{"type":34,"tag":186,"props":994,"children":995},{"style":199},[996],{"type":40,"value":997},"({});\n",{"type":34,"tag":186,"props":999,"children":1000},{"class":188,"line":249},[1001,1006,1011,1015,1020],{"type":34,"tag":186,"props":1002,"children":1003},{"style":199},[1004],{"type":40,"value":1005},"app.",{"type":34,"tag":186,"props":1007,"children":1008},{"style":527},[1009],{"type":40,"value":1010},"component",{"type":34,"tag":186,"props":1012,"children":1013},{"style":199},[1014],{"type":40,"value":734},{"type":34,"tag":186,"props":1016,"children":1017},{"style":496},[1018],{"type":40,"value":1019},"'vue-app'",{"type":34,"tag":186,"props":1021,"children":1022},{"style":199},[1023],{"type":40,"value":1024},", VueApp);\n",{"type":34,"tag":186,"props":1026,"children":1027},{"class":188,"line":257},[1028,1032,1037,1041,1046],{"type":34,"tag":186,"props":1029,"children":1030},{"style":199},[1031],{"type":40,"value":1005},{"type":34,"tag":186,"props":1033,"children":1034},{"style":527},[1035],{"type":40,"value":1036},"mount",{"type":34,"tag":186,"props":1038,"children":1039},{"style":199},[1040],{"type":40,"value":734},{"type":34,"tag":186,"props":1042,"children":1043},{"style":496},[1044],{"type":40,"value":1045},"'#app'",{"type":34,"tag":186,"props":1047,"children":1048},{"style":199},[1049],{"type":40,"value":744},{"type":34,"tag":42,"props":1051,"children":1052},{},[1053],{"type":40,"value":1054},"If you opened your app now, you will see this message in the console",{"type":34,"tag":176,"props":1056,"children":1058},{"className":178,"code":1057,"language":180,"meta":7,"style":7},"# [Vue warn]: Failed to mounst app: mount target selector \"#app\" returned null.\n",[1059],{"type":34,"tag":84,"props":1060,"children":1061},{"__ignoreMap":7},[1062],{"type":34,"tag":186,"props":1063,"children":1064},{"class":188,"line":189},[1065],{"type":34,"tag":186,"props":1066,"children":1067},{"style":230},[1068],{"type":40,"value":1057},{"type":34,"tag":42,"props":1070,"children":1071},{},[1072,1074,1080,1082,1088],{"type":40,"value":1073},"This is Vue trying to find the DOM element with id ",{"type":34,"tag":84,"props":1075,"children":1077},{"className":1076},[],[1078],{"type":40,"value":1079},"app",{"type":40,"value":1081}," where the Vue instance should be mounted. This is the root of\nyour Vue app, so it's up to you where to put this element. But for a simple case I put inside\nthe root view of my app, which is ",{"type":34,"tag":84,"props":1083,"children":1085},{"className":1084},[],[1086],{"type":40,"value":1087},"welcome.blade.php",{"type":40,"value":1089}," in my case.",{"type":34,"tag":169,"props":1091,"children":1093},{"id":1092},"laravel-routing",[1094],{"type":40,"value":1095},"Laravel routing",{"type":34,"tag":42,"props":1097,"children":1098},{},[1099,1101,1107,1109,1115,1117,1123,1125,1131,1133,1138,1140,1146],{"type":40,"value":1100},"We define routes in laravel inside the ",{"type":34,"tag":84,"props":1102,"children":1104},{"className":1103},[],[1105],{"type":40,"value":1106},"/routes/web.php",{"type":40,"value":1108}," file for routes related to web-based applications and HTML\nviews or inside ",{"type":34,"tag":84,"props":1110,"children":1112},{"className":1111},[],[1113],{"type":40,"value":1114},"/routes/api.php",{"type":40,"value":1116}," file for routes related to RESTFUL APIs or any other non-web statless services.\nMy ",{"type":34,"tag":84,"props":1118,"children":1120},{"className":1119},[],[1121],{"type":40,"value":1122},"web.php",{"type":40,"value":1124}," routing file maps the root route ",{"type":34,"tag":84,"props":1126,"children":1128},{"className":1127},[],[1129],{"type":40,"value":1130},"/",{"type":40,"value":1132}," to ",{"type":34,"tag":84,"props":1134,"children":1136},{"className":1135},[],[1137],{"type":40,"value":1087},{"type":40,"value":1139},", so there's where I'll define my ",{"type":34,"tag":84,"props":1141,"children":1143},{"className":1142},[],[1144],{"type":40,"value":1145},"#app",{"type":40,"value":1147}," vue\nroot element.",{"type":34,"tag":176,"props":1149,"children":1151},{"className":454,"code":1150,"language":456,"meta":7,"style":7},"// /routes/web.php\nRoute::get('/', function () {\n  return view('welcome');\n});\n",[1152],{"type":34,"tag":84,"props":1153,"children":1154},{"__ignoreMap":7},[1155,1163,1204,1230],{"type":34,"tag":186,"props":1156,"children":1157},{"class":188,"line":189},[1158],{"type":34,"tag":186,"props":1159,"children":1160},{"style":230},[1161],{"type":40,"value":1162},"// /routes/web.php\n",{"type":34,"tag":186,"props":1164,"children":1165},{"class":188,"line":205},[1166,1171,1176,1181,1185,1190,1194,1199],{"type":34,"tag":186,"props":1167,"children":1168},{"style":533},[1169],{"type":40,"value":1170},"Route",{"type":34,"tag":186,"props":1172,"children":1173},{"style":199},[1174],{"type":40,"value":1175},"::",{"type":34,"tag":186,"props":1177,"children":1178},{"style":527},[1179],{"type":40,"value":1180},"get",{"type":34,"tag":186,"props":1182,"children":1183},{"style":199},[1184],{"type":40,"value":734},{"type":34,"tag":186,"props":1186,"children":1187},{"style":496},[1188],{"type":40,"value":1189},"'/'",{"type":34,"tag":186,"props":1191,"children":1192},{"style":199},[1193],{"type":40,"value":785},{"type":34,"tag":186,"props":1195,"children":1196},{"style":193},[1197],{"type":40,"value":1198},"function",{"type":34,"tag":186,"props":1200,"children":1201},{"style":199},[1202],{"type":40,"value":1203}," () {\n",{"type":34,"tag":186,"props":1205,"children":1206},{"class":188,"line":24},[1207,1212,1217,1221,1226],{"type":34,"tag":186,"props":1208,"children":1209},{"style":193},[1210],{"type":40,"value":1211},"  return",{"type":34,"tag":186,"props":1213,"children":1214},{"style":527},[1215],{"type":40,"value":1216}," view",{"type":34,"tag":186,"props":1218,"children":1219},{"style":199},[1220],{"type":40,"value":734},{"type":34,"tag":186,"props":1222,"children":1223},{"style":496},[1224],{"type":40,"value":1225},"'welcome'",{"type":34,"tag":186,"props":1227,"children":1228},{"style":199},[1229],{"type":40,"value":744},{"type":34,"tag":186,"props":1231,"children":1232},{"class":188,"line":226},[1233],{"type":34,"tag":186,"props":1234,"children":1235},{"style":199},[1236],{"type":40,"value":1237},"});\n",{"type":34,"tag":176,"props":1239,"children":1243},{"className":1240,"code":1241,"language":1242,"meta":7,"style":7},"language-html shiki shiki-themes github-dark-default","\u003C!-- resources/views/welcome.blade.php -->\n\u003Cdiv id=\"app\">\n  \u003Cvue-app>\u003C/vue-app>\n\u003C/div>\n","html",[1244],{"type":34,"tag":84,"props":1245,"children":1246},{"__ignoreMap":7},[1247,1255,1289,1315],{"type":34,"tag":186,"props":1248,"children":1249},{"class":188,"line":189},[1250],{"type":34,"tag":186,"props":1251,"children":1252},{"style":230},[1253],{"type":40,"value":1254},"\u003C!-- resources/views/welcome.blade.php -->\n",{"type":34,"tag":186,"props":1256,"children":1257},{"class":188,"line":205},[1258,1263,1269,1274,1279,1284],{"type":34,"tag":186,"props":1259,"children":1260},{"style":199},[1261],{"type":40,"value":1262},"\u003C",{"type":34,"tag":186,"props":1264,"children":1266},{"style":1265},"--shiki-default:#7EE787",[1267],{"type":40,"value":1268},"div",{"type":34,"tag":186,"props":1270,"children":1271},{"style":716},[1272],{"type":40,"value":1273}," id",{"type":34,"tag":186,"props":1275,"children":1276},{"style":199},[1277],{"type":40,"value":1278},"=",{"type":34,"tag":186,"props":1280,"children":1281},{"style":496},[1282],{"type":40,"value":1283},"\"app\"",{"type":34,"tag":186,"props":1285,"children":1286},{"style":199},[1287],{"type":40,"value":1288},">\n",{"type":34,"tag":186,"props":1290,"children":1291},{"class":188,"line":24},[1292,1297,1302,1307,1311],{"type":34,"tag":186,"props":1293,"children":1294},{"style":199},[1295],{"type":40,"value":1296},"  \u003C",{"type":34,"tag":186,"props":1298,"children":1299},{"style":1265},[1300],{"type":40,"value":1301},"vue-app",{"type":34,"tag":186,"props":1303,"children":1304},{"style":199},[1305],{"type":40,"value":1306},">\u003C/",{"type":34,"tag":186,"props":1308,"children":1309},{"style":1265},[1310],{"type":40,"value":1301},{"type":34,"tag":186,"props":1312,"children":1313},{"style":199},[1314],{"type":40,"value":1288},{"type":34,"tag":186,"props":1316,"children":1317},{"class":188,"line":226},[1318,1323,1327],{"type":34,"tag":186,"props":1319,"children":1320},{"style":199},[1321],{"type":40,"value":1322},"\u003C/",{"type":34,"tag":186,"props":1324,"children":1325},{"style":1265},[1326],{"type":40,"value":1268},{"type":34,"tag":186,"props":1328,"children":1329},{"style":199},[1330],{"type":40,"value":1288},{"type":34,"tag":169,"props":1332,"children":1334},{"id":1333},"your-first-vue-component",[1335],{"type":40,"value":1336},"Your first vue component",{"type":34,"tag":42,"props":1338,"children":1339},{},[1340,1342,1348],{"type":40,"value":1341},"In Laravel, we create new Vue components in ",{"type":34,"tag":84,"props":1343,"children":1345},{"className":1344},[],[1346],{"type":40,"value":1347},"/resources/js/components",{"type":40,"value":1349}," directory to serve as the root component for our\nvue app.",{"type":34,"tag":176,"props":1351,"children":1354},{"className":1352,"code":1353,"language":16,"meta":7,"style":7},"language-vue shiki shiki-themes github-dark-default","\u003C!-- /resources/components/VueApp.vue-->\n\n\u003Ctemplate>\n  \u003Ch1>Welcome to my vue app\u003C/h1>\n\u003C/template>\n\n\u003Cscript>\nexport default {\n  name: 'VueApp',\n};\n\u003C/script>\n",[1355],{"type":34,"tag":84,"props":1356,"children":1357},{"__ignoreMap":7},[1358,1366,1373,1389,1413,1428,1435,1451,1467,1484,1496],{"type":34,"tag":186,"props":1359,"children":1360},{"class":188,"line":189},[1361],{"type":34,"tag":186,"props":1362,"children":1363},{"style":230},[1364],{"type":40,"value":1365},"\u003C!-- /resources/components/VueApp.vue-->\n",{"type":34,"tag":186,"props":1367,"children":1368},{"class":188,"line":205},[1369],{"type":34,"tag":186,"props":1370,"children":1371},{"emptyLinePlaceholder":10},[1372],{"type":40,"value":223},{"type":34,"tag":186,"props":1374,"children":1375},{"class":188,"line":24},[1376,1380,1385],{"type":34,"tag":186,"props":1377,"children":1378},{"style":199},[1379],{"type":40,"value":1262},{"type":34,"tag":186,"props":1381,"children":1382},{"style":1265},[1383],{"type":40,"value":1384},"template",{"type":34,"tag":186,"props":1386,"children":1387},{"style":199},[1388],{"type":40,"value":1288},{"type":34,"tag":186,"props":1390,"children":1391},{"class":188,"line":226},[1392,1396,1400,1405,1409],{"type":34,"tag":186,"props":1393,"children":1394},{"style":199},[1395],{"type":40,"value":1296},{"type":34,"tag":186,"props":1397,"children":1398},{"style":1265},[1399],{"type":40,"value":35},{"type":34,"tag":186,"props":1401,"children":1402},{"style":199},[1403],{"type":40,"value":1404},">Welcome to my vue app\u003C/",{"type":34,"tag":186,"props":1406,"children":1407},{"style":1265},[1408],{"type":40,"value":35},{"type":34,"tag":186,"props":1410,"children":1411},{"style":199},[1412],{"type":40,"value":1288},{"type":34,"tag":186,"props":1414,"children":1415},{"class":188,"line":236},[1416,1420,1424],{"type":34,"tag":186,"props":1417,"children":1418},{"style":199},[1419],{"type":40,"value":1322},{"type":34,"tag":186,"props":1421,"children":1422},{"style":1265},[1423],{"type":40,"value":1384},{"type":34,"tag":186,"props":1425,"children":1426},{"style":199},[1427],{"type":40,"value":1288},{"type":34,"tag":186,"props":1429,"children":1430},{"class":188,"line":249},[1431],{"type":34,"tag":186,"props":1432,"children":1433},{"emptyLinePlaceholder":10},[1434],{"type":40,"value":223},{"type":34,"tag":186,"props":1436,"children":1437},{"class":188,"line":257},[1438,1442,1447],{"type":34,"tag":186,"props":1439,"children":1440},{"style":199},[1441],{"type":40,"value":1262},{"type":34,"tag":186,"props":1443,"children":1444},{"style":1265},[1445],{"type":40,"value":1446},"script",{"type":34,"tag":186,"props":1448,"children":1449},{"style":199},[1450],{"type":40,"value":1288},{"type":34,"tag":186,"props":1452,"children":1453},{"class":188,"line":266},[1454,1458,1462],{"type":34,"tag":186,"props":1455,"children":1456},{"style":193},[1457],{"type":40,"value":519},{"type":34,"tag":186,"props":1459,"children":1460},{"style":193},[1461],{"type":40,"value":524},{"type":34,"tag":186,"props":1463,"children":1464},{"style":533},[1465],{"type":40,"value":1466}," {\n",{"type":34,"tag":186,"props":1468,"children":1469},{"class":188,"line":279},[1470,1475,1480],{"type":34,"tag":186,"props":1471,"children":1472},{"style":199},[1473],{"type":40,"value":1474},"  name: ",{"type":34,"tag":186,"props":1476,"children":1477},{"style":496},[1478],{"type":40,"value":1479},"'VueApp'",{"type":34,"tag":186,"props":1481,"children":1482},{"style":533},[1483],{"type":40,"value":578},{"type":34,"tag":186,"props":1485,"children":1486},{"class":188,"line":287},[1487,1492],{"type":34,"tag":186,"props":1488,"children":1489},{"style":533},[1490],{"type":40,"value":1491},"}",{"type":34,"tag":186,"props":1493,"children":1494},{"style":199},[1495],{"type":40,"value":504},{"type":34,"tag":186,"props":1497,"children":1498},{"class":188,"line":296},[1499,1503,1507],{"type":34,"tag":186,"props":1500,"children":1501},{"style":199},[1502],{"type":40,"value":1322},{"type":34,"tag":186,"props":1504,"children":1505},{"style":1265},[1506],{"type":40,"value":1446},{"type":34,"tag":186,"props":1508,"children":1509},{"style":199},[1510],{"type":40,"value":1288},{"type":34,"tag":169,"props":1512,"children":1514},{"id":1513},"vue-and-sass",[1515],{"type":40,"value":1516},"Vue and Sass",{"type":34,"tag":42,"props":1518,"children":1519},{},[1520,1522,1528,1530,1535,1537,1543],{"type":40,"value":1521},"If you installed ",{"type":34,"tag":84,"props":1523,"children":1525},{"className":1524},[],[1526],{"type":40,"value":1527},"sass",{"type":40,"value":1529}," package in the first step, you need to add an entry point for ",{"type":34,"tag":84,"props":1531,"children":1533},{"className":1532},[],[1534],{"type":40,"value":19},{"type":40,"value":1536}," to know how to compile and\nbundle your SASS assets. Create a new file at ",{"type":34,"tag":84,"props":1538,"children":1540},{"className":1539},[],[1541],{"type":40,"value":1542},"resources/sass/app.scss",{"type":40,"value":321},{"type":34,"tag":42,"props":1545,"children":1546},{},[1547],{"type":40,"value":1548},"Here's an example of the content of this file:",{"type":34,"tag":176,"props":1550,"children":1554},{"className":1551,"code":1552,"language":1553,"meta":7,"style":7},"language-scss shiki shiki-themes github-dark-default","// resources/sass/app.scss\n\n// Fonts\n@import url('https://fonts.bunny.net/css?family=Nunito');\n","scss",[1555],{"type":34,"tag":84,"props":1556,"children":1557},{"__ignoreMap":7},[1558,1566,1573,1581],{"type":34,"tag":186,"props":1559,"children":1560},{"class":188,"line":189},[1561],{"type":34,"tag":186,"props":1562,"children":1563},{"style":230},[1564],{"type":40,"value":1565},"// resources/sass/app.scss\n",{"type":34,"tag":186,"props":1567,"children":1568},{"class":188,"line":205},[1569],{"type":34,"tag":186,"props":1570,"children":1571},{"emptyLinePlaceholder":10},[1572],{"type":40,"value":223},{"type":34,"tag":186,"props":1574,"children":1575},{"class":188,"line":24},[1576],{"type":34,"tag":186,"props":1577,"children":1578},{"style":230},[1579],{"type":40,"value":1580},"// Fonts\n",{"type":34,"tag":186,"props":1582,"children":1583},{"class":188,"line":226},[1584,1589,1594,1598,1603],{"type":34,"tag":186,"props":1585,"children":1586},{"style":193},[1587],{"type":40,"value":1588},"@import",{"type":34,"tag":186,"props":1590,"children":1591},{"style":716},[1592],{"type":40,"value":1593}," url",{"type":34,"tag":186,"props":1595,"children":1596},{"style":199},[1597],{"type":40,"value":734},{"type":34,"tag":186,"props":1599,"children":1600},{"style":496},[1601],{"type":40,"value":1602},"'https://fonts.bunny.net/css?family=Nunito'",{"type":34,"tag":186,"props":1604,"children":1605},{"style":199},[1606],{"type":40,"value":744},{"type":34,"tag":169,"props":1608,"children":1610},{"id":1609},"passing-data-from-laravel-to-vue",[1611],{"type":40,"value":1612},"Passing data from laravel to vue",{"type":34,"tag":42,"props":1614,"children":1615},{},[1616],{"type":40,"value":1617},"We also have the flexibility to pass down props from a laravel blade view to a vue component; this could be anything\nincluding a model variable. In this example, we pass the authenticated user to our root vue component.",{"type":34,"tag":176,"props":1619,"children":1621},{"className":1240,"code":1620,"language":1242,"meta":7,"style":7},"\u003C!-- welcome.blade.php -->\n\u003Cvue-app :user-id=\"{{ Auth::user()->id }}\">\u003C/vue-app>\n",[1622],{"type":34,"tag":84,"props":1623,"children":1624},{"__ignoreMap":7},[1625,1633],{"type":34,"tag":186,"props":1626,"children":1627},{"class":188,"line":189},[1628],{"type":34,"tag":186,"props":1629,"children":1630},{"style":230},[1631],{"type":40,"value":1632},"\u003C!-- welcome.blade.php -->\n",{"type":34,"tag":186,"props":1634,"children":1635},{"class":188,"line":205},[1636,1640,1644,1649,1653,1658,1662,1666],{"type":34,"tag":186,"props":1637,"children":1638},{"style":199},[1639],{"type":40,"value":1262},{"type":34,"tag":186,"props":1641,"children":1642},{"style":1265},[1643],{"type":40,"value":1301},{"type":34,"tag":186,"props":1645,"children":1646},{"style":716},[1647],{"type":40,"value":1648}," :user-id",{"type":34,"tag":186,"props":1650,"children":1651},{"style":199},[1652],{"type":40,"value":1278},{"type":34,"tag":186,"props":1654,"children":1655},{"style":496},[1656],{"type":40,"value":1657},"\"{{ Auth::user()->id }}\"",{"type":34,"tag":186,"props":1659,"children":1660},{"style":199},[1661],{"type":40,"value":1306},{"type":34,"tag":186,"props":1663,"children":1664},{"style":1265},[1665],{"type":40,"value":1301},{"type":34,"tag":186,"props":1667,"children":1668},{"style":199},[1669],{"type":40,"value":1288},{"type":34,"tag":176,"props":1671,"children":1673},{"className":1352,"code":1672,"language":16,"meta":7,"style":7},"\u003C!-- /resources/components/VueApp.vue-->\n\n\u003Ctemplate>\n  \u003Ch1>Welcome to my vue app {{ userId }}\u003C/h1>\n\u003C/template>\n\n\u003Cscript>\nexport default {\n  props: ['userId'],\n};\n\u003C/script>\n",[1674],{"type":34,"tag":84,"props":1675,"children":1676},{"__ignoreMap":7},[1677,1684,1691,1706,1730,1745,1752,1767,1782,1804,1815],{"type":34,"tag":186,"props":1678,"children":1679},{"class":188,"line":189},[1680],{"type":34,"tag":186,"props":1681,"children":1682},{"style":230},[1683],{"type":40,"value":1365},{"type":34,"tag":186,"props":1685,"children":1686},{"class":188,"line":205},[1687],{"type":34,"tag":186,"props":1688,"children":1689},{"emptyLinePlaceholder":10},[1690],{"type":40,"value":223},{"type":34,"tag":186,"props":1692,"children":1693},{"class":188,"line":24},[1694,1698,1702],{"type":34,"tag":186,"props":1695,"children":1696},{"style":199},[1697],{"type":40,"value":1262},{"type":34,"tag":186,"props":1699,"children":1700},{"style":1265},[1701],{"type":40,"value":1384},{"type":34,"tag":186,"props":1703,"children":1704},{"style":199},[1705],{"type":40,"value":1288},{"type":34,"tag":186,"props":1707,"children":1708},{"class":188,"line":226},[1709,1713,1717,1722,1726],{"type":34,"tag":186,"props":1710,"children":1711},{"style":199},[1712],{"type":40,"value":1296},{"type":34,"tag":186,"props":1714,"children":1715},{"style":1265},[1716],{"type":40,"value":35},{"type":34,"tag":186,"props":1718,"children":1719},{"style":199},[1720],{"type":40,"value":1721},">Welcome to my vue app {{ userId }}\u003C/",{"type":34,"tag":186,"props":1723,"children":1724},{"style":1265},[1725],{"type":40,"value":35},{"type":34,"tag":186,"props":1727,"children":1728},{"style":199},[1729],{"type":40,"value":1288},{"type":34,"tag":186,"props":1731,"children":1732},{"class":188,"line":236},[1733,1737,1741],{"type":34,"tag":186,"props":1734,"children":1735},{"style":199},[1736],{"type":40,"value":1322},{"type":34,"tag":186,"props":1738,"children":1739},{"style":1265},[1740],{"type":40,"value":1384},{"type":34,"tag":186,"props":1742,"children":1743},{"style":199},[1744],{"type":40,"value":1288},{"type":34,"tag":186,"props":1746,"children":1747},{"class":188,"line":249},[1748],{"type":34,"tag":186,"props":1749,"children":1750},{"emptyLinePlaceholder":10},[1751],{"type":40,"value":223},{"type":34,"tag":186,"props":1753,"children":1754},{"class":188,"line":257},[1755,1759,1763],{"type":34,"tag":186,"props":1756,"children":1757},{"style":199},[1758],{"type":40,"value":1262},{"type":34,"tag":186,"props":1760,"children":1761},{"style":1265},[1762],{"type":40,"value":1446},{"type":34,"tag":186,"props":1764,"children":1765},{"style":199},[1766],{"type":40,"value":1288},{"type":34,"tag":186,"props":1768,"children":1769},{"class":188,"line":266},[1770,1774,1778],{"type":34,"tag":186,"props":1771,"children":1772},{"style":193},[1773],{"type":40,"value":519},{"type":34,"tag":186,"props":1775,"children":1776},{"style":193},[1777],{"type":40,"value":524},{"type":34,"tag":186,"props":1779,"children":1780},{"style":533},[1781],{"type":40,"value":1466},{"type":34,"tag":186,"props":1783,"children":1784},{"class":188,"line":279},[1785,1790,1795,1800],{"type":34,"tag":186,"props":1786,"children":1787},{"style":199},[1788],{"type":40,"value":1789},"  props: [",{"type":34,"tag":186,"props":1791,"children":1792},{"style":496},[1793],{"type":40,"value":1794},"'userId'",{"type":34,"tag":186,"props":1796,"children":1797},{"style":199},[1798],{"type":40,"value":1799},"]",{"type":34,"tag":186,"props":1801,"children":1802},{"style":533},[1803],{"type":40,"value":578},{"type":34,"tag":186,"props":1805,"children":1806},{"class":188,"line":287},[1807,1811],{"type":34,"tag":186,"props":1808,"children":1809},{"style":533},[1810],{"type":40,"value":1491},{"type":34,"tag":186,"props":1812,"children":1813},{"style":199},[1814],{"type":40,"value":504},{"type":34,"tag":186,"props":1816,"children":1817},{"class":188,"line":296},[1818,1822,1826],{"type":34,"tag":186,"props":1819,"children":1820},{"style":199},[1821],{"type":40,"value":1322},{"type":34,"tag":186,"props":1823,"children":1824},{"style":1265},[1825],{"type":40,"value":1446},{"type":34,"tag":186,"props":1827,"children":1828},{"style":199},[1829],{"type":40,"value":1288},{"type":34,"tag":169,"props":1831,"children":1833},{"id":1832},"run-the-frontend-server",[1834],{"type":40,"value":1835},"Run the frontend server",{"type":34,"tag":42,"props":1837,"children":1838},{},[1839,1841,1846],{"type":40,"value":1840},"It's the time to run the dev server to compile your Javascript and CSS assets. ",{"type":34,"tag":84,"props":1842,"children":1844},{"className":1843},[],[1845],{"type":40,"value":375},{"type":40,"value":1847}," will automatically watch for any\nfile changes and hot reload the app, no additional configurations needed.",{"type":34,"tag":176,"props":1849,"children":1851},{"className":178,"code":1850,"language":180,"meta":7,"style":7},"> npm run dev\n",[1852],{"type":34,"tag":84,"props":1853,"children":1854},{"__ignoreMap":7},[1855],{"type":34,"tag":186,"props":1856,"children":1857},{"class":188,"line":189},[1858,1862],{"type":34,"tag":186,"props":1859,"children":1860},{"style":193},[1861],{"type":40,"value":196},{"type":34,"tag":186,"props":1863,"children":1864},{"style":199},[1865],{"type":40,"value":306},{"type":34,"tag":169,"props":1867,"children":1869},{"id":1868},"loading-your-scripts-and-styles",[1870],{"type":40,"value":1871},"Loading your scripts and styles",{"type":34,"tag":42,"props":1873,"children":1874},{},[1875,1877,1883,1885,1891,1893,1898,1899,1905,1907,1912,1914,1920,1922,1927,1929,1934,1936,1942],{"type":40,"value":1876},"We use the ",{"type":34,"tag":84,"props":1878,"children":1880},{"className":1879},[],[1881],{"type":40,"value":1882},"@vite()",{"type":40,"value":1884}," blade directive in the ",{"type":34,"tag":84,"props":1886,"children":1888},{"className":1887},[],[1889],{"type":40,"value":1890},"\u003Chead>",{"type":40,"value":1892}," of your application's root template with the entry points of\nyour ",{"type":34,"tag":84,"props":1894,"children":1896},{"className":1895},[],[1897],{"type":40,"value":456},{"type":40,"value":785},{"type":34,"tag":84,"props":1900,"children":1902},{"className":1901},[],[1903],{"type":40,"value":1904},"css",{"type":40,"value":1906}," or ",{"type":34,"tag":84,"props":1908,"children":1910},{"className":1909},[],[1911],{"type":40,"value":1553},{"type":40,"value":1913},", located at ",{"type":34,"tag":84,"props":1915,"children":1917},{"className":1916},[],[1918],{"type":40,"value":1919},"app.blade.php",{"type":40,"value":1921},"file, this directive locates and loads the compiled ",{"type":34,"tag":84,"props":1923,"children":1925},{"className":1924},[],[1926],{"type":40,"value":456},{"type":40,"value":1928},"\nand ",{"type":34,"tag":84,"props":1930,"children":1932},{"className":1931},[],[1933],{"type":40,"value":1553},{"type":40,"value":1935}," files compiled to ",{"type":34,"tag":84,"props":1937,"children":1939},{"className":1938},[],[1940],{"type":40,"value":1941},"public/js/app.js",{"type":40,"value":321},{"type":34,"tag":176,"props":1944,"children":1946},{"className":1240,"code":1945,"language":1242,"meta":7,"style":7},"\u003Chead>\n  \u003C!--    ... your existing \u003Chead> and meta-tags here ... -->\n  @vite(['resources/sass/app.scss', 'resources/js/app.js'])\n\u003C/head>\n",[1947],{"type":34,"tag":84,"props":1948,"children":1949},{"__ignoreMap":7},[1950,1966,1974,1982],{"type":34,"tag":186,"props":1951,"children":1952},{"class":188,"line":189},[1953,1957,1962],{"type":34,"tag":186,"props":1954,"children":1955},{"style":199},[1956],{"type":40,"value":1262},{"type":34,"tag":186,"props":1958,"children":1959},{"style":1265},[1960],{"type":40,"value":1961},"head",{"type":34,"tag":186,"props":1963,"children":1964},{"style":199},[1965],{"type":40,"value":1288},{"type":34,"tag":186,"props":1967,"children":1968},{"class":188,"line":205},[1969],{"type":34,"tag":186,"props":1970,"children":1971},{"style":230},[1972],{"type":40,"value":1973},"  \u003C!--    ... your existing \u003Chead> and meta-tags here ... -->\n",{"type":34,"tag":186,"props":1975,"children":1976},{"class":188,"line":24},[1977],{"type":34,"tag":186,"props":1978,"children":1979},{"style":199},[1980],{"type":40,"value":1981},"  @vite(['resources/sass/app.scss', 'resources/js/app.js'])\n",{"type":34,"tag":186,"props":1983,"children":1984},{"class":188,"line":226},[1985,1989,1993],{"type":34,"tag":186,"props":1986,"children":1987},{"style":199},[1988],{"type":40,"value":1322},{"type":34,"tag":186,"props":1990,"children":1991},{"style":1265},[1992],{"type":40,"value":1961},{"type":34,"tag":186,"props":1994,"children":1995},{"style":199},[1996],{"type":40,"value":1288},{"type":34,"tag":42,"props":1998,"children":1999},{},[2000,2002,2007],{"type":40,"value":2001},"If you don't use ",{"type":34,"tag":84,"props":2003,"children":2005},{"className":2004},[],[2006],{"type":40,"value":1553},{"type":40,"value":2008}," or only are using them inside your Vue components, you only need to include the JavaScript entry\npoint.",{"type":34,"tag":176,"props":2010,"children":2012},{"className":1240,"code":2011,"language":1242,"meta":7,"style":7},"\u003Chead>\n  \u003C!--    ... your existing \u003Chead> and meta-tags here ... -->\n  @vite('resources/js/app.js')\n\u003C/head>\n",[2013],{"type":34,"tag":84,"props":2014,"children":2015},{"__ignoreMap":7},[2016,2031,2038,2046],{"type":34,"tag":186,"props":2017,"children":2018},{"class":188,"line":189},[2019,2023,2027],{"type":34,"tag":186,"props":2020,"children":2021},{"style":199},[2022],{"type":40,"value":1262},{"type":34,"tag":186,"props":2024,"children":2025},{"style":1265},[2026],{"type":40,"value":1961},{"type":34,"tag":186,"props":2028,"children":2029},{"style":199},[2030],{"type":40,"value":1288},{"type":34,"tag":186,"props":2032,"children":2033},{"class":188,"line":205},[2034],{"type":34,"tag":186,"props":2035,"children":2036},{"style":230},[2037],{"type":40,"value":1973},{"type":34,"tag":186,"props":2039,"children":2040},{"class":188,"line":24},[2041],{"type":34,"tag":186,"props":2042,"children":2043},{"style":199},[2044],{"type":40,"value":2045},"  @vite('resources/js/app.js')\n",{"type":34,"tag":186,"props":2047,"children":2048},{"class":188,"line":226},[2049,2053,2057],{"type":34,"tag":186,"props":2050,"children":2051},{"style":199},[2052],{"type":40,"value":1322},{"type":34,"tag":186,"props":2054,"children":2055},{"style":1265},[2056],{"type":40,"value":1961},{"type":34,"tag":186,"props":2058,"children":2059},{"style":199},[2060],{"type":40,"value":1288},{"type":34,"tag":42,"props":2062,"children":2063},{},[2064,2066,2072,2074,2079,2081,2086],{"type":40,"value":2065},"Again, if you're using ",{"type":34,"tag":84,"props":2067,"children":2069},{"className":2068},[],[2070],{"type":40,"value":2071},"webpack",{"type":40,"value":2073}," instead of ",{"type":34,"tag":84,"props":2075,"children":2077},{"className":2076},[],[2078],{"type":40,"value":19},{"type":40,"value":2080},", put this line at the end of you application's root template, mine\nis ",{"type":34,"tag":84,"props":2082,"children":2084},{"className":2083},[],[2085],{"type":40,"value":1087},{"type":40,"value":321},{"type":34,"tag":176,"props":2088,"children":2090},{"className":1240,"code":2089,"language":1242,"meta":7,"style":7},"\u003Cscript src=\"{{ mix('/js/app.js') }}\">\u003C/script>\n",[2091],{"type":34,"tag":84,"props":2092,"children":2093},{"__ignoreMap":7},[2094],{"type":34,"tag":186,"props":2095,"children":2096},{"class":188,"line":189},[2097,2101,2105,2110,2114,2119,2123,2127],{"type":34,"tag":186,"props":2098,"children":2099},{"style":199},[2100],{"type":40,"value":1262},{"type":34,"tag":186,"props":2102,"children":2103},{"style":1265},[2104],{"type":40,"value":1446},{"type":34,"tag":186,"props":2106,"children":2107},{"style":716},[2108],{"type":40,"value":2109}," src",{"type":34,"tag":186,"props":2111,"children":2112},{"style":199},[2113],{"type":40,"value":1278},{"type":34,"tag":186,"props":2115,"children":2116},{"style":496},[2117],{"type":40,"value":2118},"\"{{ mix('/js/app.js') }}\"",{"type":34,"tag":186,"props":2120,"children":2121},{"style":199},[2122],{"type":40,"value":1306},{"type":34,"tag":186,"props":2124,"children":2125},{"style":1265},[2126],{"type":40,"value":1446},{"type":34,"tag":186,"props":2128,"children":2129},{"style":199},[2130],{"type":40,"value":1288},{"type":34,"tag":47,"props":2132,"children":2134},{"id":2133},"vue-router",[2135],{"type":40,"value":2136},"Vue router",{"type":34,"tag":42,"props":2138,"children":2139},{},[2140],{"type":40,"value":2141},"Ok, now, we have a Vue app up and running. But there's something important missing. What if the user wants to\nnavigate to another page? We can use Laravel routing for this, but it would require sending requests to the\nserver, waiting for it render the page, send us the response HTML back and reload the current page.",{"type":34,"tag":42,"props":2143,"children":2144},{},[2145,2147,2156],{"type":40,"value":2146},"Our goal in this story is to build a ",{"type":34,"tag":2148,"props":2149,"children":2150},"u",{},[2151],{"type":34,"tag":69,"props":2152,"children":2153},{},[2154],{"type":40,"value":2155},"Single Page App (SPA)",{"type":40,"value":2157}," where a user would only have to load the app once,\nthen communicate with the backend using APIs to fetch new data. To do so we need to install Vue Router, a tool that\nallows us to navigate SPA Frontend applications.",{"type":34,"tag":169,"props":2159,"children":2161},{"id":2160},"install-vue-router",[2162],{"type":40,"value":2163},"Install vue router",{"type":34,"tag":176,"props":2165,"children":2167},{"className":178,"code":2166,"language":180,"meta":7,"style":7},"> npm install vue-router\n",[2168],{"type":34,"tag":84,"props":2169,"children":2170},{"__ignoreMap":7},[2171],{"type":34,"tag":186,"props":2172,"children":2173},{"class":188,"line":189},[2174,2178],{"type":34,"tag":186,"props":2175,"children":2176},{"style":193},[2177],{"type":40,"value":196},{"type":34,"tag":186,"props":2179,"children":2180},{"style":199},[2181],{"type":40,"value":2182}," npm install vue-router\n",{"type":34,"tag":169,"props":2184,"children":2186},{"id":2185},"setup-vue-router-and-routes",[2187],{"type":40,"value":2188},"Setup vue router and routes",{"type":34,"tag":42,"props":2190,"children":2191},{},[2192,2194,2199,2201,2207,2209,2215],{"type":40,"value":2193},"First, create two new components inside the ",{"type":34,"tag":84,"props":2195,"children":2197},{"className":2196},[],[2198],{"type":40,"value":1347},{"type":40,"value":2200}," directory named",{"type":34,"tag":84,"props":2202,"children":2204},{"className":2203},[],[2205],{"type":40,"value":2206},"Page1.vue",{"type":40,"value":2208}," and ",{"type":34,"tag":84,"props":2210,"children":2212},{"className":2211},[],[2213],{"type":40,"value":2214},"Page2.vue",{"type":40,"value":321},{"type":34,"tag":42,"props":2217,"children":2218},{},[2219,2221,2227],{"type":40,"value":2220},"Next, Let's edit the ",{"type":34,"tag":84,"props":2222,"children":2224},{"className":2223},[],[2225],{"type":40,"value":2226},"app.js",{"type":40,"value":2228}," file once again to configure vue router and put in some new routes.",{"type":34,"tag":176,"props":2230,"children":2232},{"className":454,"code":2231,"language":456,"meta":7,"style":7},"// resources/js/app.js\nimport './bootstrap';\n\nimport { createApp } from 'vue';\nimport * as VueRouter from 'vue-router';\n\nimport VueApp from './components/VueApp.vue';\nimport Page1 from './components/Page1.vue';\nimport Page2 from './components/Page2.vue';\n\nconst routes = [\n  { path: '/page1', component: Page1, name: 'page1' },\n  { path: '/page2', component: Page2, name: 'page2' },\n];\n\nconst router = VueRouter.createRouter({\n  history: VueRouter.createWebHashHistory(),\n  routes,\n});\n\nconst app = createApp({});\napp.component('vue-app', VueApp);\napp.use(router);\napp.mount('#app');\n",[2233],{"type":34,"tag":84,"props":2234,"children":2235},{"__ignoreMap":7},[2236,2244,2259,2266,2289,2324,2331,2354,2379,2404,2411,2432,2460,2486,2494,2501,2532,2551,2560,2568,2576,2600,2624,2642],{"type":34,"tag":186,"props":2237,"children":2238},{"class":188,"line":189},[2239],{"type":34,"tag":186,"props":2240,"children":2241},{"style":230},[2242],{"type":40,"value":2243},"// resources/js/app.js\n",{"type":34,"tag":186,"props":2245,"children":2246},{"class":188,"line":205},[2247,2251,2255],{"type":34,"tag":186,"props":2248,"children":2249},{"style":193},[2250],{"type":40,"value":483},{"type":34,"tag":186,"props":2252,"children":2253},{"style":496},[2254],{"type":40,"value":910},{"type":34,"tag":186,"props":2256,"children":2257},{"style":199},[2258],{"type":40,"value":504},{"type":34,"tag":186,"props":2260,"children":2261},{"class":188,"line":24},[2262],{"type":34,"tag":186,"props":2263,"children":2264},{"emptyLinePlaceholder":10},[2265],{"type":40,"value":223},{"type":34,"tag":186,"props":2267,"children":2268},{"class":188,"line":226},[2269,2273,2277,2281,2285],{"type":34,"tag":186,"props":2270,"children":2271},{"style":193},[2272],{"type":40,"value":483},{"type":34,"tag":186,"props":2274,"children":2275},{"style":199},[2276],{"type":40,"value":926},{"type":34,"tag":186,"props":2278,"children":2279},{"style":193},[2280],{"type":40,"value":493},{"type":34,"tag":186,"props":2282,"children":2283},{"style":496},[2284],{"type":40,"value":935},{"type":34,"tag":186,"props":2286,"children":2287},{"style":199},[2288],{"type":40,"value":504},{"type":34,"tag":186,"props":2290,"children":2291},{"class":188,"line":236},[2292,2296,2301,2306,2311,2315,2320],{"type":34,"tag":186,"props":2293,"children":2294},{"style":193},[2295],{"type":40,"value":483},{"type":34,"tag":186,"props":2297,"children":2298},{"style":716},[2299],{"type":40,"value":2300}," *",{"type":34,"tag":186,"props":2302,"children":2303},{"style":193},[2304],{"type":40,"value":2305}," as",{"type":34,"tag":186,"props":2307,"children":2308},{"style":199},[2309],{"type":40,"value":2310}," VueRouter ",{"type":34,"tag":186,"props":2312,"children":2313},{"style":193},[2314],{"type":40,"value":493},{"type":34,"tag":186,"props":2316,"children":2317},{"style":496},[2318],{"type":40,"value":2319}," 'vue-router'",{"type":34,"tag":186,"props":2321,"children":2322},{"style":199},[2323],{"type":40,"value":504},{"type":34,"tag":186,"props":2325,"children":2326},{"class":188,"line":249},[2327],{"type":34,"tag":186,"props":2328,"children":2329},{"emptyLinePlaceholder":10},[2330],{"type":40,"value":223},{"type":34,"tag":186,"props":2332,"children":2333},{"class":188,"line":257},[2334,2338,2342,2346,2350],{"type":34,"tag":186,"props":2335,"children":2336},{"style":193},[2337],{"type":40,"value":483},{"type":34,"tag":186,"props":2339,"children":2340},{"style":199},[2341],{"type":40,"value":951},{"type":34,"tag":186,"props":2343,"children":2344},{"style":193},[2345],{"type":40,"value":493},{"type":34,"tag":186,"props":2347,"children":2348},{"style":496},[2349],{"type":40,"value":960},{"type":34,"tag":186,"props":2351,"children":2352},{"style":199},[2353],{"type":40,"value":504},{"type":34,"tag":186,"props":2355,"children":2356},{"class":188,"line":266},[2357,2361,2366,2370,2375],{"type":34,"tag":186,"props":2358,"children":2359},{"style":193},[2360],{"type":40,"value":483},{"type":34,"tag":186,"props":2362,"children":2363},{"style":199},[2364],{"type":40,"value":2365}," Page1 ",{"type":34,"tag":186,"props":2367,"children":2368},{"style":193},[2369],{"type":40,"value":493},{"type":34,"tag":186,"props":2371,"children":2372},{"style":496},[2373],{"type":40,"value":2374}," './components/Page1.vue'",{"type":34,"tag":186,"props":2376,"children":2377},{"style":199},[2378],{"type":40,"value":504},{"type":34,"tag":186,"props":2380,"children":2381},{"class":188,"line":279},[2382,2386,2391,2395,2400],{"type":34,"tag":186,"props":2383,"children":2384},{"style":193},[2385],{"type":40,"value":483},{"type":34,"tag":186,"props":2387,"children":2388},{"style":199},[2389],{"type":40,"value":2390}," Page2 ",{"type":34,"tag":186,"props":2392,"children":2393},{"style":193},[2394],{"type":40,"value":493},{"type":34,"tag":186,"props":2396,"children":2397},{"style":496},[2398],{"type":40,"value":2399}," './components/Page2.vue'",{"type":34,"tag":186,"props":2401,"children":2402},{"style":199},[2403],{"type":40,"value":504},{"type":34,"tag":186,"props":2405,"children":2406},{"class":188,"line":287},[2407],{"type":34,"tag":186,"props":2408,"children":2409},{"emptyLinePlaceholder":10},[2410],{"type":40,"value":223},{"type":34,"tag":186,"props":2412,"children":2413},{"class":188,"line":296},[2414,2418,2423,2427],{"type":34,"tag":186,"props":2415,"children":2416},{"style":193},[2417],{"type":40,"value":713},{"type":34,"tag":186,"props":2419,"children":2420},{"style":716},[2421],{"type":40,"value":2422}," routes",{"type":34,"tag":186,"props":2424,"children":2425},{"style":193},[2426],{"type":40,"value":724},{"type":34,"tag":186,"props":2428,"children":2429},{"style":199},[2430],{"type":40,"value":2431}," [\n",{"type":34,"tag":186,"props":2433,"children":2434},{"class":188,"line":597},[2435,2440,2445,2450,2455],{"type":34,"tag":186,"props":2436,"children":2437},{"style":199},[2438],{"type":40,"value":2439},"  { path: ",{"type":34,"tag":186,"props":2441,"children":2442},{"style":496},[2443],{"type":40,"value":2444},"'/page1'",{"type":34,"tag":186,"props":2446,"children":2447},{"style":199},[2448],{"type":40,"value":2449},", component: Page1, name: ",{"type":34,"tag":186,"props":2451,"children":2452},{"style":496},[2453],{"type":40,"value":2454},"'page1'",{"type":34,"tag":186,"props":2456,"children":2457},{"style":199},[2458],{"type":40,"value":2459}," },\n",{"type":34,"tag":186,"props":2461,"children":2462},{"class":188,"line":615},[2463,2467,2472,2477,2482],{"type":34,"tag":186,"props":2464,"children":2465},{"style":199},[2466],{"type":40,"value":2439},{"type":34,"tag":186,"props":2468,"children":2469},{"style":496},[2470],{"type":40,"value":2471},"'/page2'",{"type":34,"tag":186,"props":2473,"children":2474},{"style":199},[2475],{"type":40,"value":2476},", component: Page2, name: ",{"type":34,"tag":186,"props":2478,"children":2479},{"style":496},[2480],{"type":40,"value":2481},"'page2'",{"type":34,"tag":186,"props":2483,"children":2484},{"style":199},[2485],{"type":40,"value":2459},{"type":34,"tag":186,"props":2487,"children":2488},{"class":188,"line":624},[2489],{"type":34,"tag":186,"props":2490,"children":2491},{"style":199},[2492],{"type":40,"value":2493},"];\n",{"type":34,"tag":186,"props":2495,"children":2496},{"class":188,"line":637},[2497],{"type":34,"tag":186,"props":2498,"children":2499},{"emptyLinePlaceholder":10},[2500],{"type":40,"value":223},{"type":34,"tag":186,"props":2502,"children":2504},{"class":188,"line":2503},16,[2505,2509,2514,2518,2523,2528],{"type":34,"tag":186,"props":2506,"children":2507},{"style":193},[2508],{"type":40,"value":713},{"type":34,"tag":186,"props":2510,"children":2511},{"style":716},[2512],{"type":40,"value":2513}," router",{"type":34,"tag":186,"props":2515,"children":2516},{"style":193},[2517],{"type":40,"value":724},{"type":34,"tag":186,"props":2519,"children":2520},{"style":199},[2521],{"type":40,"value":2522}," VueRouter.",{"type":34,"tag":186,"props":2524,"children":2525},{"style":527},[2526],{"type":40,"value":2527},"createRouter",{"type":34,"tag":186,"props":2529,"children":2530},{"style":199},[2531],{"type":40,"value":536},{"type":34,"tag":186,"props":2533,"children":2535},{"class":188,"line":2534},17,[2536,2541,2546],{"type":34,"tag":186,"props":2537,"children":2538},{"style":199},[2539],{"type":40,"value":2540},"  history: VueRouter.",{"type":34,"tag":186,"props":2542,"children":2543},{"style":527},[2544],{"type":40,"value":2545},"createWebHashHistory",{"type":34,"tag":186,"props":2547,"children":2548},{"style":199},[2549],{"type":40,"value":2550},"(),\n",{"type":34,"tag":186,"props":2552,"children":2554},{"class":188,"line":2553},18,[2555],{"type":34,"tag":186,"props":2556,"children":2557},{"style":199},[2558],{"type":40,"value":2559},"  routes,\n",{"type":34,"tag":186,"props":2561,"children":2563},{"class":188,"line":2562},19,[2564],{"type":34,"tag":186,"props":2565,"children":2566},{"style":199},[2567],{"type":40,"value":1237},{"type":34,"tag":186,"props":2569,"children":2571},{"class":188,"line":2570},20,[2572],{"type":34,"tag":186,"props":2573,"children":2574},{"emptyLinePlaceholder":10},[2575],{"type":40,"value":223},{"type":34,"tag":186,"props":2577,"children":2579},{"class":188,"line":2578},21,[2580,2584,2588,2592,2596],{"type":34,"tag":186,"props":2581,"children":2582},{"style":193},[2583],{"type":40,"value":713},{"type":34,"tag":186,"props":2585,"children":2586},{"style":716},[2587],{"type":40,"value":983},{"type":34,"tag":186,"props":2589,"children":2590},{"style":193},[2591],{"type":40,"value":724},{"type":34,"tag":186,"props":2593,"children":2594},{"style":527},[2595],{"type":40,"value":992},{"type":34,"tag":186,"props":2597,"children":2598},{"style":199},[2599],{"type":40,"value":997},{"type":34,"tag":186,"props":2601,"children":2603},{"class":188,"line":2602},22,[2604,2608,2612,2616,2620],{"type":34,"tag":186,"props":2605,"children":2606},{"style":199},[2607],{"type":40,"value":1005},{"type":34,"tag":186,"props":2609,"children":2610},{"style":527},[2611],{"type":40,"value":1010},{"type":34,"tag":186,"props":2613,"children":2614},{"style":199},[2615],{"type":40,"value":734},{"type":34,"tag":186,"props":2617,"children":2618},{"style":496},[2619],{"type":40,"value":1019},{"type":34,"tag":186,"props":2621,"children":2622},{"style":199},[2623],{"type":40,"value":1024},{"type":34,"tag":186,"props":2625,"children":2627},{"class":188,"line":2626},23,[2628,2632,2637],{"type":34,"tag":186,"props":2629,"children":2630},{"style":199},[2631],{"type":40,"value":1005},{"type":34,"tag":186,"props":2633,"children":2634},{"style":527},[2635],{"type":40,"value":2636},"use",{"type":34,"tag":186,"props":2638,"children":2639},{"style":199},[2640],{"type":40,"value":2641},"(router);\n",{"type":34,"tag":186,"props":2643,"children":2645},{"class":188,"line":2644},24,[2646,2650,2654,2658,2662],{"type":34,"tag":186,"props":2647,"children":2648},{"style":199},[2649],{"type":40,"value":1005},{"type":34,"tag":186,"props":2651,"children":2652},{"style":527},[2653],{"type":40,"value":1036},{"type":34,"tag":186,"props":2655,"children":2656},{"style":199},[2657],{"type":40,"value":734},{"type":34,"tag":186,"props":2659,"children":2660},{"style":496},[2661],{"type":40,"value":1045},{"type":34,"tag":186,"props":2663,"children":2664},{"style":199},[2665],{"type":40,"value":744},{"type":34,"tag":42,"props":2667,"children":2668},{},[2669],{"type":40,"value":2670},"What we did here is installing vue router plugin to vue, to extend vue by adding routing functionality.",{"type":34,"tag":42,"props":2672,"children":2673},{},[2674,2676,2682],{"type":40,"value":2675},"Next, edit your parent vue component",{"type":34,"tag":84,"props":2677,"children":2679},{"className":2678},[],[2680],{"type":40,"value":2681},"VueApp.vue",{"type":40,"value":2683}," file once again, to add the navigation links, and the vue router outlet\ncomponent.",{"type":34,"tag":176,"props":2685,"children":2687},{"className":1352,"code":2686,"language":16,"meta":7,"style":7},"\u003C!-- /resources/js/components/VueApp.vue -->\n\u003Cnav class=\"navbar\">\n  \u003Cdiv class=\"container\">\n    \u003Cul class=\"navbar-nav\">\n      \u003Crouter-link :to=\"{ name: 'page1' }\" class=\"nav-link\">Page 1\u003C/router-link>\n      \u003Crouter-link :to=\"{ name: 'page2' }\" class=\"nav-link\">Page 2\u003C/router-link>\n    \u003C/ul>\n  \u003C/div>\n\u003C/nav>\n\n\u003C!-- router pages will be injected and switched here ...  -->\n\u003Crouter-view>\u003C/router-view>\n",[2688],{"type":34,"tag":84,"props":2689,"children":2690},{"__ignoreMap":7},[2691,2699,2729,2737,2745,2753,2761,2769,2777,2792,2799,2807],{"type":34,"tag":186,"props":2692,"children":2693},{"class":188,"line":189},[2694],{"type":34,"tag":186,"props":2695,"children":2696},{"style":230},[2697],{"type":40,"value":2698},"\u003C!-- /resources/js/components/VueApp.vue -->\n",{"type":34,"tag":186,"props":2700,"children":2701},{"class":188,"line":205},[2702,2706,2711,2716,2720,2725],{"type":34,"tag":186,"props":2703,"children":2704},{"style":199},[2705],{"type":40,"value":1262},{"type":34,"tag":186,"props":2707,"children":2708},{"style":1265},[2709],{"type":40,"value":2710},"nav",{"type":34,"tag":186,"props":2712,"children":2713},{"style":716},[2714],{"type":40,"value":2715}," class",{"type":34,"tag":186,"props":2717,"children":2718},{"style":199},[2719],{"type":40,"value":1278},{"type":34,"tag":186,"props":2721,"children":2722},{"style":496},[2723],{"type":40,"value":2724},"\"navbar\"",{"type":34,"tag":186,"props":2726,"children":2727},{"style":199},[2728],{"type":40,"value":1288},{"type":34,"tag":186,"props":2730,"children":2731},{"class":188,"line":24},[2732],{"type":34,"tag":186,"props":2733,"children":2734},{"style":199},[2735],{"type":40,"value":2736},"  \u003Cdiv class=\"container\">\n",{"type":34,"tag":186,"props":2738,"children":2739},{"class":188,"line":226},[2740],{"type":34,"tag":186,"props":2741,"children":2742},{"style":199},[2743],{"type":40,"value":2744},"    \u003Cul class=\"navbar-nav\">\n",{"type":34,"tag":186,"props":2746,"children":2747},{"class":188,"line":236},[2748],{"type":34,"tag":186,"props":2749,"children":2750},{"style":199},[2751],{"type":40,"value":2752},"      \u003Crouter-link :to=\"{ name: 'page1' }\" class=\"nav-link\">Page 1\u003C/router-link>\n",{"type":34,"tag":186,"props":2754,"children":2755},{"class":188,"line":249},[2756],{"type":34,"tag":186,"props":2757,"children":2758},{"style":199},[2759],{"type":40,"value":2760},"      \u003Crouter-link :to=\"{ name: 'page2' }\" class=\"nav-link\">Page 2\u003C/router-link>\n",{"type":34,"tag":186,"props":2762,"children":2763},{"class":188,"line":257},[2764],{"type":34,"tag":186,"props":2765,"children":2766},{"style":199},[2767],{"type":40,"value":2768},"    \u003C/ul>\n",{"type":34,"tag":186,"props":2770,"children":2771},{"class":188,"line":266},[2772],{"type":34,"tag":186,"props":2773,"children":2774},{"style":199},[2775],{"type":40,"value":2776},"  \u003C/div>\n",{"type":34,"tag":186,"props":2778,"children":2779},{"class":188,"line":279},[2780,2784,2788],{"type":34,"tag":186,"props":2781,"children":2782},{"style":199},[2783],{"type":40,"value":1322},{"type":34,"tag":186,"props":2785,"children":2786},{"style":1265},[2787],{"type":40,"value":2710},{"type":34,"tag":186,"props":2789,"children":2790},{"style":199},[2791],{"type":40,"value":1288},{"type":34,"tag":186,"props":2793,"children":2794},{"class":188,"line":287},[2795],{"type":34,"tag":186,"props":2796,"children":2797},{"emptyLinePlaceholder":10},[2798],{"type":40,"value":223},{"type":34,"tag":186,"props":2800,"children":2801},{"class":188,"line":296},[2802],{"type":34,"tag":186,"props":2803,"children":2804},{"style":230},[2805],{"type":40,"value":2806},"\u003C!-- router pages will be injected and switched here ...  -->\n",{"type":34,"tag":186,"props":2808,"children":2809},{"class":188,"line":597},[2810,2814,2819,2823,2827],{"type":34,"tag":186,"props":2811,"children":2812},{"style":199},[2813],{"type":40,"value":1262},{"type":34,"tag":186,"props":2815,"children":2816},{"style":1265},[2817],{"type":40,"value":2818},"router-view",{"type":34,"tag":186,"props":2820,"children":2821},{"style":199},[2822],{"type":40,"value":1306},{"type":34,"tag":186,"props":2824,"children":2825},{"style":1265},[2826],{"type":40,"value":2818},{"type":34,"tag":186,"props":2828,"children":2829},{"style":199},[2830],{"type":40,"value":1288},{"type":34,"tag":169,"props":2832,"children":2834},{"id":2833},"how-vue-router-works",[2835],{"type":40,"value":2836},"How vue router works",{"type":34,"tag":138,"props":2838,"children":2839},{},[2840,2851,2880],{"type":34,"tag":142,"props":2841,"children":2842},{},[2843,2849],{"type":34,"tag":84,"props":2844,"children":2846},{"className":2845},[],[2847],{"type":40,"value":2848},"VueApp",{"type":40,"value":2850},": is our root vue component, the parent container, the whole vue app will be rendered inside this container.",{"type":34,"tag":142,"props":2852,"children":2853},{},[2854,2856,2862,2864,2870,2872,2878],{"type":40,"value":2855},"What vue router is doing behind the scene is mapping some routes (urls) to some vue components. Here is maps ",{"type":34,"tag":84,"props":2857,"children":2859},{"className":2858},[],[2860],{"type":40,"value":2861},"/pages1",{"type":40,"value":2863},"\nto ",{"type":34,"tag":84,"props":2865,"children":2867},{"className":2866},[],[2868],{"type":40,"value":2869},"Page1",{"type":40,"value":2871}," component for example. and when the URL changes, vue router then switch between these components\nin place of ",{"type":34,"tag":84,"props":2873,"children":2875},{"className":2874},[],[2876],{"type":40,"value":2877},"\u003Crouter-view>",{"type":40,"value":2879}," outlet.",{"type":34,"tag":142,"props":2881,"children":2882},{},[2883,2885,2891,2893,2899],{"type":40,"value":2884},"When navigating inside a Frontend app we use the ",{"type":34,"tag":84,"props":2886,"children":2888},{"className":2887},[],[2889],{"type":40,"value":2890},"\u003Crouter-link",{"type":40,"value":2892}," and specify either the path or the component name we\nwant to navigate to. We use it instead of ",{"type":34,"tag":84,"props":2894,"children":2896},{"className":2895},[],[2897],{"type":40,"value":2898},"\u003Ca href=\"...\">",{"type":40,"value":2900}," This allows Vue Router to change the URL without reloading\nthe page.",{"type":34,"tag":42,"props":2902,"children":2903},{},[2904,2906],{"type":40,"value":2905},"More about vue rotuer and how to use it for advanced cases ",{"type":34,"tag":2148,"props":2907,"children":2908},{},[2909],{"type":34,"tag":313,"props":2910,"children":2913},{"href":2911,"rel":2912},"https://router.vuejs.org/guide/",[317],[2914],{"type":40,"value":2915},"here",{"type":34,"tag":47,"props":2917,"children":2919},{"id":2918},"source-code",[2920],{"type":40,"value":2921},"Source Code",{"type":34,"tag":42,"props":2923,"children":2924},{},[2925,2927],{"type":40,"value":2926},"The source code to the application in this story is available\non ",{"type":34,"tag":2148,"props":2928,"children":2929},{},[2930],{"type":34,"tag":313,"props":2931,"children":2934},{"href":2932,"rel":2933},"https://github.com/iartist93/laravel-vue",[317],[2935],{"type":40,"value":2936},"Github",{"type":34,"tag":2938,"props":2939,"children":2940},"style",{},[2941],{"type":40,"value":2942},"html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}",{"title":7,"searchDepth":205,"depth":205,"links":2944},[2945,2946,2947,2948,2949,2962,2967],{"id":17,"depth":205,"text":51},{"id":59,"depth":205,"text":62},{"id":16,"depth":205,"text":96},{"id":128,"depth":205,"text":131},{"id":164,"depth":205,"text":167,"children":2950},[2951,2952,2953,2954,2955,2956,2957,2958,2959,2960,2961],{"id":171,"depth":24,"text":174},{"id":324,"depth":24,"text":327},{"id":357,"depth":24,"text":360},{"id":662,"depth":24,"text":665},{"id":875,"depth":24,"text":878},{"id":1092,"depth":24,"text":1095},{"id":1333,"depth":24,"text":1336},{"id":1513,"depth":24,"text":1516},{"id":1609,"depth":24,"text":1612},{"id":1832,"depth":24,"text":1835},{"id":1868,"depth":24,"text":1871},{"id":2133,"depth":205,"text":2136,"children":2963},[2964,2965,2966],{"id":2160,"depth":24,"text":2163},{"id":2185,"depth":24,"text":2188},{"id":2833,"depth":24,"text":2836},{"id":2918,"depth":205,"text":2921},"markdown","content:stories:vue-into-the-laravel-verse.md","content","stories/vue-into-the-laravel-verse.md","md",{"_path":4,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":8,"description":9,"published":10,"category":11,"metaTitle":8,"metaDesc":8,"date":12,"created-at":12,"updated-at":12,"tags":2974,"keywords":2975,"image":23,"id":24,"readingTime":2976,"body":2977,"_type":2968,"_id":2969,"_source":2970,"_file":2971,"_extension":2972},[14,15,16,17,18,19,20],[14,15,16,17,18,19,22],{"text":26,"minutes":27,"time":28,"words":29},{"type":31,"children":2978,"toc":5474},[2979,2983,2987,2991,2995,2999,3019,3023,3037,3046,3050,3054,3073,3077,3081,3184,3194,3198,3222,3226,3251,3259,3268,3272,3289,3299,3462,3471,3475,3503,3649,3653,3657,3667,3810,3814,3827,3843,3847,3887,3965,4043,4047,4057,4208,4212,4234,4238,4288,4292,4296,4344,4499,4503,4513,4530,4534,4592,4642,4652,4702,4724,4765,4769,4773,4785,4789,4806,4810,4832,4842,5240,5244,5254,5388,5392,5442,5454,5458,5470],{"type":34,"tag":35,"props":2980,"children":2981},{"id":37},[2982],{"type":40,"value":8},{"type":34,"tag":42,"props":2984,"children":2985},{},[2986],{"type":40,"value":9},{"type":34,"tag":47,"props":2988,"children":2989},{"id":17},[2990],{"type":40,"value":51},{"type":34,"tag":42,"props":2992,"children":2993},{},[2994],{"type":40,"value":56},{"type":34,"tag":47,"props":2996,"children":2997},{"id":59},[2998],{"type":40,"value":62},{"type":34,"tag":42,"props":3000,"children":3001},{},[3002,3003,3007,3008,3012,3013,3018],{"type":40,"value":67},{"type":34,"tag":69,"props":3004,"children":3005},{},[3006],{"type":40,"value":20},{"type":40,"value":74},{"type":34,"tag":76,"props":3009,"children":3010},{},[3011],{"type":40,"value":80},{"type":40,"value":82},{"type":34,"tag":84,"props":3014,"children":3016},{"className":3015},[],[3017],{"type":40,"value":89},{"type":40,"value":91},{"type":34,"tag":47,"props":3020,"children":3021},{"id":16},[3022],{"type":40,"value":96},{"type":34,"tag":42,"props":3024,"children":3025},{},[3026,3027,3031,3032,3036],{"type":40,"value":101},{"type":34,"tag":69,"props":3028,"children":3029},{},[3030],{"type":40,"value":96},{"type":40,"value":107},{"type":34,"tag":69,"props":3033,"children":3034},{},[3035],{"type":40,"value":112},{"type":40,"value":114},{"type":34,"tag":42,"props":3038,"children":3039},{},[3040,3041,3045],{"type":40,"value":119},{"type":34,"tag":69,"props":3042,"children":3043},{},[3044],{"type":40,"value":20},{"type":40,"value":125},{"type":34,"tag":47,"props":3047,"children":3048},{"id":128},[3049],{"type":40,"value":131},{"type":34,"tag":42,"props":3051,"children":3052},{},[3053],{"type":40,"value":136},{"type":34,"tag":138,"props":3055,"children":3056},{},[3057,3061,3065,3069],{"type":34,"tag":142,"props":3058,"children":3059},{},[3060],{"type":40,"value":146},{"type":34,"tag":142,"props":3062,"children":3063},{},[3064],{"type":40,"value":151},{"type":34,"tag":142,"props":3066,"children":3067},{},[3068],{"type":40,"value":156},{"type":34,"tag":142,"props":3070,"children":3071},{},[3072],{"type":40,"value":161},{"type":34,"tag":47,"props":3074,"children":3075},{"id":164},[3076],{"type":40,"value":167},{"type":34,"tag":169,"props":3078,"children":3079},{"id":171},[3080],{"type":40,"value":174},{"type":34,"tag":176,"props":3082,"children":3083},{"className":178,"code":179,"language":180,"meta":7,"style":7},[3084],{"type":34,"tag":84,"props":3085,"children":3086},{"__ignoreMap":7},[3087,3098,3109,3116,3123,3134,3141,3148,3159,3166,3173],{"type":34,"tag":186,"props":3088,"children":3089},{"class":188,"line":189},[3090,3094],{"type":34,"tag":186,"props":3091,"children":3092},{"style":193},[3093],{"type":40,"value":196},{"type":34,"tag":186,"props":3095,"children":3096},{"style":199},[3097],{"type":40,"value":202},{"type":34,"tag":186,"props":3099,"children":3100},{"class":188,"line":205},[3101,3105],{"type":34,"tag":186,"props":3102,"children":3103},{"style":193},[3104],{"type":40,"value":196},{"type":34,"tag":186,"props":3106,"children":3107},{"style":199},[3108],{"type":40,"value":215},{"type":34,"tag":186,"props":3110,"children":3111},{"class":188,"line":24},[3112],{"type":34,"tag":186,"props":3113,"children":3114},{"emptyLinePlaceholder":10},[3115],{"type":40,"value":223},{"type":34,"tag":186,"props":3117,"children":3118},{"class":188,"line":226},[3119],{"type":34,"tag":186,"props":3120,"children":3121},{"style":230},[3122],{"type":40,"value":233},{"type":34,"tag":186,"props":3124,"children":3125},{"class":188,"line":236},[3126,3130],{"type":34,"tag":186,"props":3127,"children":3128},{"style":193},[3129],{"type":40,"value":196},{"type":34,"tag":186,"props":3131,"children":3132},{"style":199},[3133],{"type":40,"value":246},{"type":34,"tag":186,"props":3135,"children":3136},{"class":188,"line":249},[3137],{"type":34,"tag":186,"props":3138,"children":3139},{"emptyLinePlaceholder":10},[3140],{"type":40,"value":223},{"type":34,"tag":186,"props":3142,"children":3143},{"class":188,"line":257},[3144],{"type":34,"tag":186,"props":3145,"children":3146},{"style":230},[3147],{"type":40,"value":263},{"type":34,"tag":186,"props":3149,"children":3150},{"class":188,"line":266},[3151,3155],{"type":34,"tag":186,"props":3152,"children":3153},{"style":193},[3154],{"type":40,"value":196},{"type":34,"tag":186,"props":3156,"children":3157},{"style":199},[3158],{"type":40,"value":276},{"type":34,"tag":186,"props":3160,"children":3161},{"class":188,"line":279},[3162],{"type":34,"tag":186,"props":3163,"children":3164},{"emptyLinePlaceholder":10},[3165],{"type":40,"value":223},{"type":34,"tag":186,"props":3167,"children":3168},{"class":188,"line":287},[3169],{"type":34,"tag":186,"props":3170,"children":3171},{"style":230},[3172],{"type":40,"value":293},{"type":34,"tag":186,"props":3174,"children":3175},{"class":188,"line":296},[3176,3180],{"type":34,"tag":186,"props":3177,"children":3178},{"style":193},[3179],{"type":40,"value":196},{"type":34,"tag":186,"props":3181,"children":3182},{"style":199},[3183],{"type":40,"value":306},{"type":34,"tag":42,"props":3185,"children":3186},{},[3187,3188,3193],{"type":40,"value":311},{"type":34,"tag":313,"props":3189,"children":3191},{"href":315,"rel":3190},[317],[3192],{"type":40,"value":315},{"type":40,"value":321},{"type":34,"tag":169,"props":3195,"children":3196},{"id":324},[3197],{"type":40,"value":327},{"type":34,"tag":176,"props":3199,"children":3200},{"className":178,"code":330,"language":180,"meta":7,"style":7},[3201],{"type":34,"tag":84,"props":3202,"children":3203},{"__ignoreMap":7},[3204,3211],{"type":34,"tag":186,"props":3205,"children":3206},{"class":188,"line":189},[3207],{"type":34,"tag":186,"props":3208,"children":3209},{"style":230},[3210],{"type":40,"value":342},{"type":34,"tag":186,"props":3212,"children":3213},{"class":188,"line":205},[3214,3218],{"type":34,"tag":186,"props":3215,"children":3216},{"style":193},[3217],{"type":40,"value":196},{"type":34,"tag":186,"props":3219,"children":3220},{"style":199},[3221],{"type":40,"value":354},{"type":34,"tag":169,"props":3223,"children":3224},{"id":357},[3225],{"type":40,"value":360},{"type":34,"tag":362,"props":3227,"children":3228},{},[3229],{"type":34,"tag":42,"props":3230,"children":3231},{},[3232,3233,3238,3239,3244,3245,3250],{"type":40,"value":369},{"type":34,"tag":84,"props":3234,"children":3236},{"className":3235},[],[3237],{"type":40,"value":375},{"type":40,"value":377},{"type":34,"tag":84,"props":3240,"children":3242},{"className":3241},[],[3243],{"type":40,"value":383},{"type":40,"value":385},{"type":34,"tag":84,"props":3246,"children":3248},{"className":3247},[],[3249],{"type":40,"value":391},{"type":40,"value":393},{"type":34,"tag":42,"props":3252,"children":3253},{},[3254,3258],{"type":34,"tag":69,"props":3255,"children":3256},{},[3257],{"type":40,"value":375},{"type":40,"value":402},{"type":34,"tag":42,"props":3260,"children":3261},{},[3262,3263,3267],{"type":40,"value":407},{"type":34,"tag":69,"props":3264,"children":3265},{},[3266],{"type":40,"value":412},{"type":40,"value":414},{"type":34,"tag":42,"props":3269,"children":3270},{},[3271],{"type":40,"value":419},{"type":34,"tag":176,"props":3273,"children":3274},{"className":178,"code":422,"language":180,"meta":7,"style":7},[3275],{"type":34,"tag":84,"props":3276,"children":3277},{"__ignoreMap":7},[3278],{"type":34,"tag":186,"props":3279,"children":3280},{"class":188,"line":189},[3281,3285],{"type":34,"tag":186,"props":3282,"children":3283},{"style":193},[3284],{"type":40,"value":196},{"type":34,"tag":186,"props":3286,"children":3287},{"style":199},[3288],{"type":40,"value":438},{"type":34,"tag":42,"props":3290,"children":3291},{},[3292,3293,3298],{"type":40,"value":443},{"type":34,"tag":84,"props":3294,"children":3296},{"className":3295},[],[3297],{"type":40,"value":449},{"type":40,"value":451},{"type":34,"tag":176,"props":3300,"children":3301},{"className":454,"code":455,"language":456,"meta":7,"style":7},[3302],{"type":34,"tag":84,"props":3303,"children":3304},{"__ignoreMap":7},[3305,3312,3319,3342,3349,3368,3375,3382,3393,3404,3411,3418,3433,3440,3451],{"type":34,"tag":186,"props":3306,"children":3307},{"class":188,"line":189},[3308],{"type":34,"tag":186,"props":3309,"children":3310},{"style":230},[3311],{"type":40,"value":468},{"type":34,"tag":186,"props":3313,"children":3314},{"class":188,"line":205},[3315],{"type":34,"tag":186,"props":3316,"children":3317},{"emptyLinePlaceholder":10},[3318],{"type":40,"value":223},{"type":34,"tag":186,"props":3320,"children":3321},{"class":188,"line":24},[3322,3326,3330,3334,3338],{"type":34,"tag":186,"props":3323,"children":3324},{"style":193},[3325],{"type":40,"value":483},{"type":34,"tag":186,"props":3327,"children":3328},{"style":199},[3329],{"type":40,"value":488},{"type":34,"tag":186,"props":3331,"children":3332},{"style":193},[3333],{"type":40,"value":493},{"type":34,"tag":186,"props":3335,"children":3336},{"style":496},[3337],{"type":40,"value":499},{"type":34,"tag":186,"props":3339,"children":3340},{"style":199},[3341],{"type":40,"value":504},{"type":34,"tag":186,"props":3343,"children":3344},{"class":188,"line":226},[3345],{"type":34,"tag":186,"props":3346,"children":3347},{"emptyLinePlaceholder":10},[3348],{"type":40,"value":223},{"type":34,"tag":186,"props":3350,"children":3351},{"class":188,"line":236},[3352,3356,3360,3364],{"type":34,"tag":186,"props":3353,"children":3354},{"style":193},[3355],{"type":40,"value":519},{"type":34,"tag":186,"props":3357,"children":3358},{"style":193},[3359],{"type":40,"value":524},{"type":34,"tag":186,"props":3361,"children":3362},{"style":527},[3363],{"type":40,"value":530},{"type":34,"tag":186,"props":3365,"children":3366},{"style":533},[3367],{"type":40,"value":536},{"type":34,"tag":186,"props":3369,"children":3370},{"class":188,"line":249},[3371],{"type":34,"tag":186,"props":3372,"children":3373},{"style":199},[3374],{"type":40,"value":544},{"type":34,"tag":186,"props":3376,"children":3377},{"class":188,"line":257},[3378],{"type":34,"tag":186,"props":3379,"children":3380},{"style":230},[3381],{"type":40,"value":552},{"type":34,"tag":186,"props":3383,"children":3384},{"class":188,"line":266},[3385,3389],{"type":34,"tag":186,"props":3386,"children":3387},{"style":527},[3388],{"type":40,"value":560},{"type":34,"tag":186,"props":3390,"children":3391},{"style":199},[3392],{"type":40,"value":565},{"type":34,"tag":186,"props":3394,"children":3395},{"class":188,"line":279},[3396,3400],{"type":34,"tag":186,"props":3397,"children":3398},{"style":199},[3399],{"type":40,"value":573},{"type":34,"tag":186,"props":3401,"children":3402},{"style":533},[3403],{"type":40,"value":578},{"type":34,"tag":186,"props":3405,"children":3406},{"class":188,"line":287},[3407],{"type":34,"tag":186,"props":3408,"children":3409},{"style":199},[3410],{"type":40,"value":586},{"type":34,"tag":186,"props":3412,"children":3413},{"class":188,"line":296},[3414],{"type":34,"tag":186,"props":3415,"children":3416},{"style":199},[3417],{"type":40,"value":594},{"type":34,"tag":186,"props":3419,"children":3420},{"class":188,"line":597},[3421,3425,3429],{"type":34,"tag":186,"props":3422,"children":3423},{"style":199},[3424],{"type":40,"value":603},{"type":34,"tag":186,"props":3426,"children":3427},{"style":496},[3428],{"type":40,"value":608},{"type":34,"tag":186,"props":3430,"children":3431},{"style":199},[3432],{"type":40,"value":578},{"type":34,"tag":186,"props":3434,"children":3435},{"class":188,"line":615},[3436],{"type":34,"tag":186,"props":3437,"children":3438},{"style":199},[3439],{"type":40,"value":621},{"type":34,"tag":186,"props":3441,"children":3442},{"class":188,"line":624},[3443,3447],{"type":34,"tag":186,"props":3444,"children":3445},{"style":199},[3446],{"type":40,"value":630},{"type":34,"tag":186,"props":3448,"children":3449},{"style":533},[3450],{"type":40,"value":578},{"type":34,"tag":186,"props":3452,"children":3453},{"class":188,"line":637},[3454,3458],{"type":34,"tag":186,"props":3455,"children":3456},{"style":533},[3457],{"type":40,"value":643},{"type":34,"tag":186,"props":3459,"children":3460},{"style":199},[3461],{"type":40,"value":504},{"type":34,"tag":42,"props":3463,"children":3464},{},[3465,3466],{"type":40,"value":652},{"type":34,"tag":313,"props":3467,"children":3469},{"href":655,"rel":3468},[317],[3470],{"type":40,"value":659},{"type":34,"tag":169,"props":3472,"children":3473},{"id":662},[3474],{"type":40,"value":665},{"type":34,"tag":42,"props":3476,"children":3477},{},[3478,3479,3484,3485,3490,3491,3496,3497,3502],{"type":40,"value":670},{"type":34,"tag":84,"props":3480,"children":3482},{"className":3481},[],[3483],{"type":40,"value":375},{"type":40,"value":677},{"type":34,"tag":84,"props":3486,"children":3488},{"className":3487},[],[3489],{"type":40,"value":383},{"type":40,"value":684},{"type":34,"tag":84,"props":3492,"children":3494},{"className":3493},[],[3495],{"type":40,"value":690},{"type":40,"value":692},{"type":34,"tag":84,"props":3498,"children":3500},{"className":3499},[],[3501],{"type":40,"value":449},{"type":40,"value":321},{"type":34,"tag":176,"props":3504,"children":3505},{"className":454,"code":701,"language":456,"meta":7,"style":7},[3506],{"type":34,"tag":84,"props":3507,"children":3508},{"__ignoreMap":7},[3509,3540,3547,3554,3585,3604,3635,3642],{"type":34,"tag":186,"props":3510,"children":3511},{"class":188,"line":189},[3512,3516,3520,3524,3528,3532,3536],{"type":34,"tag":186,"props":3513,"children":3514},{"style":193},[3515],{"type":40,"value":713},{"type":34,"tag":186,"props":3517,"children":3518},{"style":716},[3519],{"type":40,"value":719},{"type":34,"tag":186,"props":3521,"children":3522},{"style":193},[3523],{"type":40,"value":724},{"type":34,"tag":186,"props":3525,"children":3526},{"style":527},[3527],{"type":40,"value":729},{"type":34,"tag":186,"props":3529,"children":3530},{"style":199},[3531],{"type":40,"value":734},{"type":34,"tag":186,"props":3533,"children":3534},{"style":496},[3535],{"type":40,"value":739},{"type":34,"tag":186,"props":3537,"children":3538},{"style":199},[3539],{"type":40,"value":744},{"type":34,"tag":186,"props":3541,"children":3542},{"class":188,"line":205},[3543],{"type":34,"tag":186,"props":3544,"children":3545},{"emptyLinePlaceholder":10},[3546],{"type":40,"value":223},{"type":34,"tag":186,"props":3548,"children":3549},{"class":188,"line":24},[3550],{"type":34,"tag":186,"props":3551,"children":3552},{"style":199},[3553],{"type":40,"value":759},{"type":34,"tag":186,"props":3555,"children":3556},{"class":188,"line":226},[3557,3561,3565,3569,3573,3577,3581],{"type":34,"tag":186,"props":3558,"children":3559},{"style":199},[3560],{"type":40,"value":767},{"type":34,"tag":186,"props":3562,"children":3563},{"style":527},[3564],{"type":40,"value":456},{"type":34,"tag":186,"props":3566,"children":3567},{"style":199},[3568],{"type":40,"value":734},{"type":34,"tag":186,"props":3570,"children":3571},{"style":496},[3572],{"type":40,"value":780},{"type":34,"tag":186,"props":3574,"children":3575},{"style":199},[3576],{"type":40,"value":785},{"type":34,"tag":186,"props":3578,"children":3579},{"style":496},[3580],{"type":40,"value":790},{"type":34,"tag":186,"props":3582,"children":3583},{"style":199},[3584],{"type":40,"value":795},{"type":34,"tag":186,"props":3586,"children":3587},{"class":188,"line":236},[3588,3592,3596,3600],{"type":34,"tag":186,"props":3589,"children":3590},{"style":199},[3591],{"type":40,"value":767},{"type":34,"tag":186,"props":3593,"children":3594},{"style":527},[3595],{"type":40,"value":16},{"type":34,"tag":186,"props":3597,"children":3598},{"style":199},[3599],{"type":40,"value":811},{"type":34,"tag":186,"props":3601,"children":3602},{"style":230},[3603],{"type":40,"value":816},{"type":34,"tag":186,"props":3605,"children":3606},{"class":188,"line":249},[3607,3611,3615,3619,3623,3627,3631],{"type":34,"tag":186,"props":3608,"children":3609},{"style":199},[3610],{"type":40,"value":767},{"type":34,"tag":186,"props":3612,"children":3613},{"style":527},[3614],{"type":40,"value":828},{"type":34,"tag":186,"props":3616,"children":3617},{"style":199},[3618],{"type":40,"value":734},{"type":34,"tag":186,"props":3620,"children":3621},{"style":496},[3622],{"type":40,"value":837},{"type":34,"tag":186,"props":3624,"children":3625},{"style":199},[3626],{"type":40,"value":785},{"type":34,"tag":186,"props":3628,"children":3629},{"style":496},[3630],{"type":40,"value":846},{"type":34,"tag":186,"props":3632,"children":3633},{"style":199},[3634],{"type":40,"value":851},{"type":34,"tag":186,"props":3636,"children":3637},{"class":188,"line":257},[3638],{"type":34,"tag":186,"props":3639,"children":3640},{"style":230},[3641],{"type":40,"value":859},{"type":34,"tag":186,"props":3643,"children":3644},{"class":188,"line":266},[3645],{"type":34,"tag":186,"props":3646,"children":3647},{"style":199},[3648],{"type":40,"value":867},{"type":34,"tag":42,"props":3650,"children":3651},{},[3652],{"type":40,"value":872},{"type":34,"tag":169,"props":3654,"children":3655},{"id":875},[3656],{"type":40,"value":878},{"type":34,"tag":42,"props":3658,"children":3659},{},[3660,3661,3666],{"type":40,"value":883},{"type":34,"tag":84,"props":3662,"children":3664},{"className":3663},[],[3665],{"type":40,"value":889},{"type":40,"value":891},{"type":34,"tag":176,"props":3668,"children":3669},{"className":454,"code":894,"language":456,"meta":7,"style":7},[3670],{"type":34,"tag":84,"props":3671,"children":3672},{"__ignoreMap":7},[3673,3688,3711,3734,3741,3764,3787],{"type":34,"tag":186,"props":3674,"children":3675},{"class":188,"line":189},[3676,3680,3684],{"type":34,"tag":186,"props":3677,"children":3678},{"style":193},[3679],{"type":40,"value":483},{"type":34,"tag":186,"props":3681,"children":3682},{"style":496},[3683],{"type":40,"value":910},{"type":34,"tag":186,"props":3685,"children":3686},{"style":199},[3687],{"type":40,"value":504},{"type":34,"tag":186,"props":3689,"children":3690},{"class":188,"line":205},[3691,3695,3699,3703,3707],{"type":34,"tag":186,"props":3692,"children":3693},{"style":193},[3694],{"type":40,"value":483},{"type":34,"tag":186,"props":3696,"children":3697},{"style":199},[3698],{"type":40,"value":926},{"type":34,"tag":186,"props":3700,"children":3701},{"style":193},[3702],{"type":40,"value":493},{"type":34,"tag":186,"props":3704,"children":3705},{"style":496},[3706],{"type":40,"value":935},{"type":34,"tag":186,"props":3708,"children":3709},{"style":199},[3710],{"type":40,"value":504},{"type":34,"tag":186,"props":3712,"children":3713},{"class":188,"line":24},[3714,3718,3722,3726,3730],{"type":34,"tag":186,"props":3715,"children":3716},{"style":193},[3717],{"type":40,"value":483},{"type":34,"tag":186,"props":3719,"children":3720},{"style":199},[3721],{"type":40,"value":951},{"type":34,"tag":186,"props":3723,"children":3724},{"style":193},[3725],{"type":40,"value":493},{"type":34,"tag":186,"props":3727,"children":3728},{"style":496},[3729],{"type":40,"value":960},{"type":34,"tag":186,"props":3731,"children":3732},{"style":199},[3733],{"type":40,"value":504},{"type":34,"tag":186,"props":3735,"children":3736},{"class":188,"line":226},[3737],{"type":34,"tag":186,"props":3738,"children":3739},{"emptyLinePlaceholder":10},[3740],{"type":40,"value":223},{"type":34,"tag":186,"props":3742,"children":3743},{"class":188,"line":236},[3744,3748,3752,3756,3760],{"type":34,"tag":186,"props":3745,"children":3746},{"style":193},[3747],{"type":40,"value":713},{"type":34,"tag":186,"props":3749,"children":3750},{"style":716},[3751],{"type":40,"value":983},{"type":34,"tag":186,"props":3753,"children":3754},{"style":193},[3755],{"type":40,"value":724},{"type":34,"tag":186,"props":3757,"children":3758},{"style":527},[3759],{"type":40,"value":992},{"type":34,"tag":186,"props":3761,"children":3762},{"style":199},[3763],{"type":40,"value":997},{"type":34,"tag":186,"props":3765,"children":3766},{"class":188,"line":249},[3767,3771,3775,3779,3783],{"type":34,"tag":186,"props":3768,"children":3769},{"style":199},[3770],{"type":40,"value":1005},{"type":34,"tag":186,"props":3772,"children":3773},{"style":527},[3774],{"type":40,"value":1010},{"type":34,"tag":186,"props":3776,"children":3777},{"style":199},[3778],{"type":40,"value":734},{"type":34,"tag":186,"props":3780,"children":3781},{"style":496},[3782],{"type":40,"value":1019},{"type":34,"tag":186,"props":3784,"children":3785},{"style":199},[3786],{"type":40,"value":1024},{"type":34,"tag":186,"props":3788,"children":3789},{"class":188,"line":257},[3790,3794,3798,3802,3806],{"type":34,"tag":186,"props":3791,"children":3792},{"style":199},[3793],{"type":40,"value":1005},{"type":34,"tag":186,"props":3795,"children":3796},{"style":527},[3797],{"type":40,"value":1036},{"type":34,"tag":186,"props":3799,"children":3800},{"style":199},[3801],{"type":40,"value":734},{"type":34,"tag":186,"props":3803,"children":3804},{"style":496},[3805],{"type":40,"value":1045},{"type":34,"tag":186,"props":3807,"children":3808},{"style":199},[3809],{"type":40,"value":744},{"type":34,"tag":42,"props":3811,"children":3812},{},[3813],{"type":40,"value":1054},{"type":34,"tag":176,"props":3815,"children":3816},{"className":178,"code":1057,"language":180,"meta":7,"style":7},[3817],{"type":34,"tag":84,"props":3818,"children":3819},{"__ignoreMap":7},[3820],{"type":34,"tag":186,"props":3821,"children":3822},{"class":188,"line":189},[3823],{"type":34,"tag":186,"props":3824,"children":3825},{"style":230},[3826],{"type":40,"value":1057},{"type":34,"tag":42,"props":3828,"children":3829},{},[3830,3831,3836,3837,3842],{"type":40,"value":1073},{"type":34,"tag":84,"props":3832,"children":3834},{"className":3833},[],[3835],{"type":40,"value":1079},{"type":40,"value":1081},{"type":34,"tag":84,"props":3838,"children":3840},{"className":3839},[],[3841],{"type":40,"value":1087},{"type":40,"value":1089},{"type":34,"tag":169,"props":3844,"children":3845},{"id":1092},[3846],{"type":40,"value":1095},{"type":34,"tag":42,"props":3848,"children":3849},{},[3850,3851,3856,3857,3862,3863,3868,3869,3874,3875,3880,3881,3886],{"type":40,"value":1100},{"type":34,"tag":84,"props":3852,"children":3854},{"className":3853},[],[3855],{"type":40,"value":1106},{"type":40,"value":1108},{"type":34,"tag":84,"props":3858,"children":3860},{"className":3859},[],[3861],{"type":40,"value":1114},{"type":40,"value":1116},{"type":34,"tag":84,"props":3864,"children":3866},{"className":3865},[],[3867],{"type":40,"value":1122},{"type":40,"value":1124},{"type":34,"tag":84,"props":3870,"children":3872},{"className":3871},[],[3873],{"type":40,"value":1130},{"type":40,"value":1132},{"type":34,"tag":84,"props":3876,"children":3878},{"className":3877},[],[3879],{"type":40,"value":1087},{"type":40,"value":1139},{"type":34,"tag":84,"props":3882,"children":3884},{"className":3883},[],[3885],{"type":40,"value":1145},{"type":40,"value":1147},{"type":34,"tag":176,"props":3888,"children":3889},{"className":454,"code":1150,"language":456,"meta":7,"style":7},[3890],{"type":34,"tag":84,"props":3891,"children":3892},{"__ignoreMap":7},[3893,3900,3935,3958],{"type":34,"tag":186,"props":3894,"children":3895},{"class":188,"line":189},[3896],{"type":34,"tag":186,"props":3897,"children":3898},{"style":230},[3899],{"type":40,"value":1162},{"type":34,"tag":186,"props":3901,"children":3902},{"class":188,"line":205},[3903,3907,3911,3915,3919,3923,3927,3931],{"type":34,"tag":186,"props":3904,"children":3905},{"style":533},[3906],{"type":40,"value":1170},{"type":34,"tag":186,"props":3908,"children":3909},{"style":199},[3910],{"type":40,"value":1175},{"type":34,"tag":186,"props":3912,"children":3913},{"style":527},[3914],{"type":40,"value":1180},{"type":34,"tag":186,"props":3916,"children":3917},{"style":199},[3918],{"type":40,"value":734},{"type":34,"tag":186,"props":3920,"children":3921},{"style":496},[3922],{"type":40,"value":1189},{"type":34,"tag":186,"props":3924,"children":3925},{"style":199},[3926],{"type":40,"value":785},{"type":34,"tag":186,"props":3928,"children":3929},{"style":193},[3930],{"type":40,"value":1198},{"type":34,"tag":186,"props":3932,"children":3933},{"style":199},[3934],{"type":40,"value":1203},{"type":34,"tag":186,"props":3936,"children":3937},{"class":188,"line":24},[3938,3942,3946,3950,3954],{"type":34,"tag":186,"props":3939,"children":3940},{"style":193},[3941],{"type":40,"value":1211},{"type":34,"tag":186,"props":3943,"children":3944},{"style":527},[3945],{"type":40,"value":1216},{"type":34,"tag":186,"props":3947,"children":3948},{"style":199},[3949],{"type":40,"value":734},{"type":34,"tag":186,"props":3951,"children":3952},{"style":496},[3953],{"type":40,"value":1225},{"type":34,"tag":186,"props":3955,"children":3956},{"style":199},[3957],{"type":40,"value":744},{"type":34,"tag":186,"props":3959,"children":3960},{"class":188,"line":226},[3961],{"type":34,"tag":186,"props":3962,"children":3963},{"style":199},[3964],{"type":40,"value":1237},{"type":34,"tag":176,"props":3966,"children":3967},{"className":1240,"code":1241,"language":1242,"meta":7,"style":7},[3968],{"type":34,"tag":84,"props":3969,"children":3970},{"__ignoreMap":7},[3971,3978,4005,4028],{"type":34,"tag":186,"props":3972,"children":3973},{"class":188,"line":189},[3974],{"type":34,"tag":186,"props":3975,"children":3976},{"style":230},[3977],{"type":40,"value":1254},{"type":34,"tag":186,"props":3979,"children":3980},{"class":188,"line":205},[3981,3985,3989,3993,3997,4001],{"type":34,"tag":186,"props":3982,"children":3983},{"style":199},[3984],{"type":40,"value":1262},{"type":34,"tag":186,"props":3986,"children":3987},{"style":1265},[3988],{"type":40,"value":1268},{"type":34,"tag":186,"props":3990,"children":3991},{"style":716},[3992],{"type":40,"value":1273},{"type":34,"tag":186,"props":3994,"children":3995},{"style":199},[3996],{"type":40,"value":1278},{"type":34,"tag":186,"props":3998,"children":3999},{"style":496},[4000],{"type":40,"value":1283},{"type":34,"tag":186,"props":4002,"children":4003},{"style":199},[4004],{"type":40,"value":1288},{"type":34,"tag":186,"props":4006,"children":4007},{"class":188,"line":24},[4008,4012,4016,4020,4024],{"type":34,"tag":186,"props":4009,"children":4010},{"style":199},[4011],{"type":40,"value":1296},{"type":34,"tag":186,"props":4013,"children":4014},{"style":1265},[4015],{"type":40,"value":1301},{"type":34,"tag":186,"props":4017,"children":4018},{"style":199},[4019],{"type":40,"value":1306},{"type":34,"tag":186,"props":4021,"children":4022},{"style":1265},[4023],{"type":40,"value":1301},{"type":34,"tag":186,"props":4025,"children":4026},{"style":199},[4027],{"type":40,"value":1288},{"type":34,"tag":186,"props":4029,"children":4030},{"class":188,"line":226},[4031,4035,4039],{"type":34,"tag":186,"props":4032,"children":4033},{"style":199},[4034],{"type":40,"value":1322},{"type":34,"tag":186,"props":4036,"children":4037},{"style":1265},[4038],{"type":40,"value":1268},{"type":34,"tag":186,"props":4040,"children":4041},{"style":199},[4042],{"type":40,"value":1288},{"type":34,"tag":169,"props":4044,"children":4045},{"id":1333},[4046],{"type":40,"value":1336},{"type":34,"tag":42,"props":4048,"children":4049},{},[4050,4051,4056],{"type":40,"value":1341},{"type":34,"tag":84,"props":4052,"children":4054},{"className":4053},[],[4055],{"type":40,"value":1347},{"type":40,"value":1349},{"type":34,"tag":176,"props":4058,"children":4059},{"className":1352,"code":1353,"language":16,"meta":7,"style":7},[4060],{"type":34,"tag":84,"props":4061,"children":4062},{"__ignoreMap":7},[4063,4070,4077,4092,4115,4130,4137,4152,4167,4182,4193],{"type":34,"tag":186,"props":4064,"children":4065},{"class":188,"line":189},[4066],{"type":34,"tag":186,"props":4067,"children":4068},{"style":230},[4069],{"type":40,"value":1365},{"type":34,"tag":186,"props":4071,"children":4072},{"class":188,"line":205},[4073],{"type":34,"tag":186,"props":4074,"children":4075},{"emptyLinePlaceholder":10},[4076],{"type":40,"value":223},{"type":34,"tag":186,"props":4078,"children":4079},{"class":188,"line":24},[4080,4084,4088],{"type":34,"tag":186,"props":4081,"children":4082},{"style":199},[4083],{"type":40,"value":1262},{"type":34,"tag":186,"props":4085,"children":4086},{"style":1265},[4087],{"type":40,"value":1384},{"type":34,"tag":186,"props":4089,"children":4090},{"style":199},[4091],{"type":40,"value":1288},{"type":34,"tag":186,"props":4093,"children":4094},{"class":188,"line":226},[4095,4099,4103,4107,4111],{"type":34,"tag":186,"props":4096,"children":4097},{"style":199},[4098],{"type":40,"value":1296},{"type":34,"tag":186,"props":4100,"children":4101},{"style":1265},[4102],{"type":40,"value":35},{"type":34,"tag":186,"props":4104,"children":4105},{"style":199},[4106],{"type":40,"value":1404},{"type":34,"tag":186,"props":4108,"children":4109},{"style":1265},[4110],{"type":40,"value":35},{"type":34,"tag":186,"props":4112,"children":4113},{"style":199},[4114],{"type":40,"value":1288},{"type":34,"tag":186,"props":4116,"children":4117},{"class":188,"line":236},[4118,4122,4126],{"type":34,"tag":186,"props":4119,"children":4120},{"style":199},[4121],{"type":40,"value":1322},{"type":34,"tag":186,"props":4123,"children":4124},{"style":1265},[4125],{"type":40,"value":1384},{"type":34,"tag":186,"props":4127,"children":4128},{"style":199},[4129],{"type":40,"value":1288},{"type":34,"tag":186,"props":4131,"children":4132},{"class":188,"line":249},[4133],{"type":34,"tag":186,"props":4134,"children":4135},{"emptyLinePlaceholder":10},[4136],{"type":40,"value":223},{"type":34,"tag":186,"props":4138,"children":4139},{"class":188,"line":257},[4140,4144,4148],{"type":34,"tag":186,"props":4141,"children":4142},{"style":199},[4143],{"type":40,"value":1262},{"type":34,"tag":186,"props":4145,"children":4146},{"style":1265},[4147],{"type":40,"value":1446},{"type":34,"tag":186,"props":4149,"children":4150},{"style":199},[4151],{"type":40,"value":1288},{"type":34,"tag":186,"props":4153,"children":4154},{"class":188,"line":266},[4155,4159,4163],{"type":34,"tag":186,"props":4156,"children":4157},{"style":193},[4158],{"type":40,"value":519},{"type":34,"tag":186,"props":4160,"children":4161},{"style":193},[4162],{"type":40,"value":524},{"type":34,"tag":186,"props":4164,"children":4165},{"style":533},[4166],{"type":40,"value":1466},{"type":34,"tag":186,"props":4168,"children":4169},{"class":188,"line":279},[4170,4174,4178],{"type":34,"tag":186,"props":4171,"children":4172},{"style":199},[4173],{"type":40,"value":1474},{"type":34,"tag":186,"props":4175,"children":4176},{"style":496},[4177],{"type":40,"value":1479},{"type":34,"tag":186,"props":4179,"children":4180},{"style":533},[4181],{"type":40,"value":578},{"type":34,"tag":186,"props":4183,"children":4184},{"class":188,"line":287},[4185,4189],{"type":34,"tag":186,"props":4186,"children":4187},{"style":533},[4188],{"type":40,"value":1491},{"type":34,"tag":186,"props":4190,"children":4191},{"style":199},[4192],{"type":40,"value":504},{"type":34,"tag":186,"props":4194,"children":4195},{"class":188,"line":296},[4196,4200,4204],{"type":34,"tag":186,"props":4197,"children":4198},{"style":199},[4199],{"type":40,"value":1322},{"type":34,"tag":186,"props":4201,"children":4202},{"style":1265},[4203],{"type":40,"value":1446},{"type":34,"tag":186,"props":4205,"children":4206},{"style":199},[4207],{"type":40,"value":1288},{"type":34,"tag":169,"props":4209,"children":4210},{"id":1513},[4211],{"type":40,"value":1516},{"type":34,"tag":42,"props":4213,"children":4214},{},[4215,4216,4221,4222,4227,4228,4233],{"type":40,"value":1521},{"type":34,"tag":84,"props":4217,"children":4219},{"className":4218},[],[4220],{"type":40,"value":1527},{"type":40,"value":1529},{"type":34,"tag":84,"props":4223,"children":4225},{"className":4224},[],[4226],{"type":40,"value":19},{"type":40,"value":1536},{"type":34,"tag":84,"props":4229,"children":4231},{"className":4230},[],[4232],{"type":40,"value":1542},{"type":40,"value":321},{"type":34,"tag":42,"props":4235,"children":4236},{},[4237],{"type":40,"value":1548},{"type":34,"tag":176,"props":4239,"children":4240},{"className":1551,"code":1552,"language":1553,"meta":7,"style":7},[4241],{"type":34,"tag":84,"props":4242,"children":4243},{"__ignoreMap":7},[4244,4251,4258,4265],{"type":34,"tag":186,"props":4245,"children":4246},{"class":188,"line":189},[4247],{"type":34,"tag":186,"props":4248,"children":4249},{"style":230},[4250],{"type":40,"value":1565},{"type":34,"tag":186,"props":4252,"children":4253},{"class":188,"line":205},[4254],{"type":34,"tag":186,"props":4255,"children":4256},{"emptyLinePlaceholder":10},[4257],{"type":40,"value":223},{"type":34,"tag":186,"props":4259,"children":4260},{"class":188,"line":24},[4261],{"type":34,"tag":186,"props":4262,"children":4263},{"style":230},[4264],{"type":40,"value":1580},{"type":34,"tag":186,"props":4266,"children":4267},{"class":188,"line":226},[4268,4272,4276,4280,4284],{"type":34,"tag":186,"props":4269,"children":4270},{"style":193},[4271],{"type":40,"value":1588},{"type":34,"tag":186,"props":4273,"children":4274},{"style":716},[4275],{"type":40,"value":1593},{"type":34,"tag":186,"props":4277,"children":4278},{"style":199},[4279],{"type":40,"value":734},{"type":34,"tag":186,"props":4281,"children":4282},{"style":496},[4283],{"type":40,"value":1602},{"type":34,"tag":186,"props":4285,"children":4286},{"style":199},[4287],{"type":40,"value":744},{"type":34,"tag":169,"props":4289,"children":4290},{"id":1609},[4291],{"type":40,"value":1612},{"type":34,"tag":42,"props":4293,"children":4294},{},[4295],{"type":40,"value":1617},{"type":34,"tag":176,"props":4297,"children":4298},{"className":1240,"code":1620,"language":1242,"meta":7,"style":7},[4299],{"type":34,"tag":84,"props":4300,"children":4301},{"__ignoreMap":7},[4302,4309],{"type":34,"tag":186,"props":4303,"children":4304},{"class":188,"line":189},[4305],{"type":34,"tag":186,"props":4306,"children":4307},{"style":230},[4308],{"type":40,"value":1632},{"type":34,"tag":186,"props":4310,"children":4311},{"class":188,"line":205},[4312,4316,4320,4324,4328,4332,4336,4340],{"type":34,"tag":186,"props":4313,"children":4314},{"style":199},[4315],{"type":40,"value":1262},{"type":34,"tag":186,"props":4317,"children":4318},{"style":1265},[4319],{"type":40,"value":1301},{"type":34,"tag":186,"props":4321,"children":4322},{"style":716},[4323],{"type":40,"value":1648},{"type":34,"tag":186,"props":4325,"children":4326},{"style":199},[4327],{"type":40,"value":1278},{"type":34,"tag":186,"props":4329,"children":4330},{"style":496},[4331],{"type":40,"value":1657},{"type":34,"tag":186,"props":4333,"children":4334},{"style":199},[4335],{"type":40,"value":1306},{"type":34,"tag":186,"props":4337,"children":4338},{"style":1265},[4339],{"type":40,"value":1301},{"type":34,"tag":186,"props":4341,"children":4342},{"style":199},[4343],{"type":40,"value":1288},{"type":34,"tag":176,"props":4345,"children":4346},{"className":1352,"code":1672,"language":16,"meta":7,"style":7},[4347],{"type":34,"tag":84,"props":4348,"children":4349},{"__ignoreMap":7},[4350,4357,4364,4379,4402,4417,4424,4439,4454,4473,4484],{"type":34,"tag":186,"props":4351,"children":4352},{"class":188,"line":189},[4353],{"type":34,"tag":186,"props":4354,"children":4355},{"style":230},[4356],{"type":40,"value":1365},{"type":34,"tag":186,"props":4358,"children":4359},{"class":188,"line":205},[4360],{"type":34,"tag":186,"props":4361,"children":4362},{"emptyLinePlaceholder":10},[4363],{"type":40,"value":223},{"type":34,"tag":186,"props":4365,"children":4366},{"class":188,"line":24},[4367,4371,4375],{"type":34,"tag":186,"props":4368,"children":4369},{"style":199},[4370],{"type":40,"value":1262},{"type":34,"tag":186,"props":4372,"children":4373},{"style":1265},[4374],{"type":40,"value":1384},{"type":34,"tag":186,"props":4376,"children":4377},{"style":199},[4378],{"type":40,"value":1288},{"type":34,"tag":186,"props":4380,"children":4381},{"class":188,"line":226},[4382,4386,4390,4394,4398],{"type":34,"tag":186,"props":4383,"children":4384},{"style":199},[4385],{"type":40,"value":1296},{"type":34,"tag":186,"props":4387,"children":4388},{"style":1265},[4389],{"type":40,"value":35},{"type":34,"tag":186,"props":4391,"children":4392},{"style":199},[4393],{"type":40,"value":1721},{"type":34,"tag":186,"props":4395,"children":4396},{"style":1265},[4397],{"type":40,"value":35},{"type":34,"tag":186,"props":4399,"children":4400},{"style":199},[4401],{"type":40,"value":1288},{"type":34,"tag":186,"props":4403,"children":4404},{"class":188,"line":236},[4405,4409,4413],{"type":34,"tag":186,"props":4406,"children":4407},{"style":199},[4408],{"type":40,"value":1322},{"type":34,"tag":186,"props":4410,"children":4411},{"style":1265},[4412],{"type":40,"value":1384},{"type":34,"tag":186,"props":4414,"children":4415},{"style":199},[4416],{"type":40,"value":1288},{"type":34,"tag":186,"props":4418,"children":4419},{"class":188,"line":249},[4420],{"type":34,"tag":186,"props":4421,"children":4422},{"emptyLinePlaceholder":10},[4423],{"type":40,"value":223},{"type":34,"tag":186,"props":4425,"children":4426},{"class":188,"line":257},[4427,4431,4435],{"type":34,"tag":186,"props":4428,"children":4429},{"style":199},[4430],{"type":40,"value":1262},{"type":34,"tag":186,"props":4432,"children":4433},{"style":1265},[4434],{"type":40,"value":1446},{"type":34,"tag":186,"props":4436,"children":4437},{"style":199},[4438],{"type":40,"value":1288},{"type":34,"tag":186,"props":4440,"children":4441},{"class":188,"line":266},[4442,4446,4450],{"type":34,"tag":186,"props":4443,"children":4444},{"style":193},[4445],{"type":40,"value":519},{"type":34,"tag":186,"props":4447,"children":4448},{"style":193},[4449],{"type":40,"value":524},{"type":34,"tag":186,"props":4451,"children":4452},{"style":533},[4453],{"type":40,"value":1466},{"type":34,"tag":186,"props":4455,"children":4456},{"class":188,"line":279},[4457,4461,4465,4469],{"type":34,"tag":186,"props":4458,"children":4459},{"style":199},[4460],{"type":40,"value":1789},{"type":34,"tag":186,"props":4462,"children":4463},{"style":496},[4464],{"type":40,"value":1794},{"type":34,"tag":186,"props":4466,"children":4467},{"style":199},[4468],{"type":40,"value":1799},{"type":34,"tag":186,"props":4470,"children":4471},{"style":533},[4472],{"type":40,"value":578},{"type":34,"tag":186,"props":4474,"children":4475},{"class":188,"line":287},[4476,4480],{"type":34,"tag":186,"props":4477,"children":4478},{"style":533},[4479],{"type":40,"value":1491},{"type":34,"tag":186,"props":4481,"children":4482},{"style":199},[4483],{"type":40,"value":504},{"type":34,"tag":186,"props":4485,"children":4486},{"class":188,"line":296},[4487,4491,4495],{"type":34,"tag":186,"props":4488,"children":4489},{"style":199},[4490],{"type":40,"value":1322},{"type":34,"tag":186,"props":4492,"children":4493},{"style":1265},[4494],{"type":40,"value":1446},{"type":34,"tag":186,"props":4496,"children":4497},{"style":199},[4498],{"type":40,"value":1288},{"type":34,"tag":169,"props":4500,"children":4501},{"id":1832},[4502],{"type":40,"value":1835},{"type":34,"tag":42,"props":4504,"children":4505},{},[4506,4507,4512],{"type":40,"value":1840},{"type":34,"tag":84,"props":4508,"children":4510},{"className":4509},[],[4511],{"type":40,"value":375},{"type":40,"value":1847},{"type":34,"tag":176,"props":4514,"children":4515},{"className":178,"code":1850,"language":180,"meta":7,"style":7},[4516],{"type":34,"tag":84,"props":4517,"children":4518},{"__ignoreMap":7},[4519],{"type":34,"tag":186,"props":4520,"children":4521},{"class":188,"line":189},[4522,4526],{"type":34,"tag":186,"props":4523,"children":4524},{"style":193},[4525],{"type":40,"value":196},{"type":34,"tag":186,"props":4527,"children":4528},{"style":199},[4529],{"type":40,"value":306},{"type":34,"tag":169,"props":4531,"children":4532},{"id":1868},[4533],{"type":40,"value":1871},{"type":34,"tag":42,"props":4535,"children":4536},{},[4537,4538,4543,4544,4549,4550,4555,4556,4561,4562,4567,4568,4573,4574,4579,4580,4585,4586,4591],{"type":40,"value":1876},{"type":34,"tag":84,"props":4539,"children":4541},{"className":4540},[],[4542],{"type":40,"value":1882},{"type":40,"value":1884},{"type":34,"tag":84,"props":4545,"children":4547},{"className":4546},[],[4548],{"type":40,"value":1890},{"type":40,"value":1892},{"type":34,"tag":84,"props":4551,"children":4553},{"className":4552},[],[4554],{"type":40,"value":456},{"type":40,"value":785},{"type":34,"tag":84,"props":4557,"children":4559},{"className":4558},[],[4560],{"type":40,"value":1904},{"type":40,"value":1906},{"type":34,"tag":84,"props":4563,"children":4565},{"className":4564},[],[4566],{"type":40,"value":1553},{"type":40,"value":1913},{"type":34,"tag":84,"props":4569,"children":4571},{"className":4570},[],[4572],{"type":40,"value":1919},{"type":40,"value":1921},{"type":34,"tag":84,"props":4575,"children":4577},{"className":4576},[],[4578],{"type":40,"value":456},{"type":40,"value":1928},{"type":34,"tag":84,"props":4581,"children":4583},{"className":4582},[],[4584],{"type":40,"value":1553},{"type":40,"value":1935},{"type":34,"tag":84,"props":4587,"children":4589},{"className":4588},[],[4590],{"type":40,"value":1941},{"type":40,"value":321},{"type":34,"tag":176,"props":4593,"children":4594},{"className":1240,"code":1945,"language":1242,"meta":7,"style":7},[4595],{"type":34,"tag":84,"props":4596,"children":4597},{"__ignoreMap":7},[4598,4613,4620,4627],{"type":34,"tag":186,"props":4599,"children":4600},{"class":188,"line":189},[4601,4605,4609],{"type":34,"tag":186,"props":4602,"children":4603},{"style":199},[4604],{"type":40,"value":1262},{"type":34,"tag":186,"props":4606,"children":4607},{"style":1265},[4608],{"type":40,"value":1961},{"type":34,"tag":186,"props":4610,"children":4611},{"style":199},[4612],{"type":40,"value":1288},{"type":34,"tag":186,"props":4614,"children":4615},{"class":188,"line":205},[4616],{"type":34,"tag":186,"props":4617,"children":4618},{"style":230},[4619],{"type":40,"value":1973},{"type":34,"tag":186,"props":4621,"children":4622},{"class":188,"line":24},[4623],{"type":34,"tag":186,"props":4624,"children":4625},{"style":199},[4626],{"type":40,"value":1981},{"type":34,"tag":186,"props":4628,"children":4629},{"class":188,"line":226},[4630,4634,4638],{"type":34,"tag":186,"props":4631,"children":4632},{"style":199},[4633],{"type":40,"value":1322},{"type":34,"tag":186,"props":4635,"children":4636},{"style":1265},[4637],{"type":40,"value":1961},{"type":34,"tag":186,"props":4639,"children":4640},{"style":199},[4641],{"type":40,"value":1288},{"type":34,"tag":42,"props":4643,"children":4644},{},[4645,4646,4651],{"type":40,"value":2001},{"type":34,"tag":84,"props":4647,"children":4649},{"className":4648},[],[4650],{"type":40,"value":1553},{"type":40,"value":2008},{"type":34,"tag":176,"props":4653,"children":4654},{"className":1240,"code":2011,"language":1242,"meta":7,"style":7},[4655],{"type":34,"tag":84,"props":4656,"children":4657},{"__ignoreMap":7},[4658,4673,4680,4687],{"type":34,"tag":186,"props":4659,"children":4660},{"class":188,"line":189},[4661,4665,4669],{"type":34,"tag":186,"props":4662,"children":4663},{"style":199},[4664],{"type":40,"value":1262},{"type":34,"tag":186,"props":4666,"children":4667},{"style":1265},[4668],{"type":40,"value":1961},{"type":34,"tag":186,"props":4670,"children":4671},{"style":199},[4672],{"type":40,"value":1288},{"type":34,"tag":186,"props":4674,"children":4675},{"class":188,"line":205},[4676],{"type":34,"tag":186,"props":4677,"children":4678},{"style":230},[4679],{"type":40,"value":1973},{"type":34,"tag":186,"props":4681,"children":4682},{"class":188,"line":24},[4683],{"type":34,"tag":186,"props":4684,"children":4685},{"style":199},[4686],{"type":40,"value":2045},{"type":34,"tag":186,"props":4688,"children":4689},{"class":188,"line":226},[4690,4694,4698],{"type":34,"tag":186,"props":4691,"children":4692},{"style":199},[4693],{"type":40,"value":1322},{"type":34,"tag":186,"props":4695,"children":4696},{"style":1265},[4697],{"type":40,"value":1961},{"type":34,"tag":186,"props":4699,"children":4700},{"style":199},[4701],{"type":40,"value":1288},{"type":34,"tag":42,"props":4703,"children":4704},{},[4705,4706,4711,4712,4717,4718,4723],{"type":40,"value":2065},{"type":34,"tag":84,"props":4707,"children":4709},{"className":4708},[],[4710],{"type":40,"value":2071},{"type":40,"value":2073},{"type":34,"tag":84,"props":4713,"children":4715},{"className":4714},[],[4716],{"type":40,"value":19},{"type":40,"value":2080},{"type":34,"tag":84,"props":4719,"children":4721},{"className":4720},[],[4722],{"type":40,"value":1087},{"type":40,"value":321},{"type":34,"tag":176,"props":4725,"children":4726},{"className":1240,"code":2089,"language":1242,"meta":7,"style":7},[4727],{"type":34,"tag":84,"props":4728,"children":4729},{"__ignoreMap":7},[4730],{"type":34,"tag":186,"props":4731,"children":4732},{"class":188,"line":189},[4733,4737,4741,4745,4749,4753,4757,4761],{"type":34,"tag":186,"props":4734,"children":4735},{"style":199},[4736],{"type":40,"value":1262},{"type":34,"tag":186,"props":4738,"children":4739},{"style":1265},[4740],{"type":40,"value":1446},{"type":34,"tag":186,"props":4742,"children":4743},{"style":716},[4744],{"type":40,"value":2109},{"type":34,"tag":186,"props":4746,"children":4747},{"style":199},[4748],{"type":40,"value":1278},{"type":34,"tag":186,"props":4750,"children":4751},{"style":496},[4752],{"type":40,"value":2118},{"type":34,"tag":186,"props":4754,"children":4755},{"style":199},[4756],{"type":40,"value":1306},{"type":34,"tag":186,"props":4758,"children":4759},{"style":1265},[4760],{"type":40,"value":1446},{"type":34,"tag":186,"props":4762,"children":4763},{"style":199},[4764],{"type":40,"value":1288},{"type":34,"tag":47,"props":4766,"children":4767},{"id":2133},[4768],{"type":40,"value":2136},{"type":34,"tag":42,"props":4770,"children":4771},{},[4772],{"type":40,"value":2141},{"type":34,"tag":42,"props":4774,"children":4775},{},[4776,4777,4784],{"type":40,"value":2146},{"type":34,"tag":2148,"props":4778,"children":4779},{},[4780],{"type":34,"tag":69,"props":4781,"children":4782},{},[4783],{"type":40,"value":2155},{"type":40,"value":2157},{"type":34,"tag":169,"props":4786,"children":4787},{"id":2160},[4788],{"type":40,"value":2163},{"type":34,"tag":176,"props":4790,"children":4791},{"className":178,"code":2166,"language":180,"meta":7,"style":7},[4792],{"type":34,"tag":84,"props":4793,"children":4794},{"__ignoreMap":7},[4795],{"type":34,"tag":186,"props":4796,"children":4797},{"class":188,"line":189},[4798,4802],{"type":34,"tag":186,"props":4799,"children":4800},{"style":193},[4801],{"type":40,"value":196},{"type":34,"tag":186,"props":4803,"children":4804},{"style":199},[4805],{"type":40,"value":2182},{"type":34,"tag":169,"props":4807,"children":4808},{"id":2185},[4809],{"type":40,"value":2188},{"type":34,"tag":42,"props":4811,"children":4812},{},[4813,4814,4819,4820,4825,4826,4831],{"type":40,"value":2193},{"type":34,"tag":84,"props":4815,"children":4817},{"className":4816},[],[4818],{"type":40,"value":1347},{"type":40,"value":2200},{"type":34,"tag":84,"props":4821,"children":4823},{"className":4822},[],[4824],{"type":40,"value":2206},{"type":40,"value":2208},{"type":34,"tag":84,"props":4827,"children":4829},{"className":4828},[],[4830],{"type":40,"value":2214},{"type":40,"value":321},{"type":34,"tag":42,"props":4833,"children":4834},{},[4835,4836,4841],{"type":40,"value":2220},{"type":34,"tag":84,"props":4837,"children":4839},{"className":4838},[],[4840],{"type":40,"value":2226},{"type":40,"value":2228},{"type":34,"tag":176,"props":4843,"children":4844},{"className":454,"code":2231,"language":456,"meta":7,"style":7},[4845],{"type":34,"tag":84,"props":4846,"children":4847},{"__ignoreMap":7},[4848,4855,4870,4877,4900,4931,4938,4961,4984,5007,5014,5033,5056,5079,5086,5093,5120,5135,5142,5149,5156,5179,5202,5217],{"type":34,"tag":186,"props":4849,"children":4850},{"class":188,"line":189},[4851],{"type":34,"tag":186,"props":4852,"children":4853},{"style":230},[4854],{"type":40,"value":2243},{"type":34,"tag":186,"props":4856,"children":4857},{"class":188,"line":205},[4858,4862,4866],{"type":34,"tag":186,"props":4859,"children":4860},{"style":193},[4861],{"type":40,"value":483},{"type":34,"tag":186,"props":4863,"children":4864},{"style":496},[4865],{"type":40,"value":910},{"type":34,"tag":186,"props":4867,"children":4868},{"style":199},[4869],{"type":40,"value":504},{"type":34,"tag":186,"props":4871,"children":4872},{"class":188,"line":24},[4873],{"type":34,"tag":186,"props":4874,"children":4875},{"emptyLinePlaceholder":10},[4876],{"type":40,"value":223},{"type":34,"tag":186,"props":4878,"children":4879},{"class":188,"line":226},[4880,4884,4888,4892,4896],{"type":34,"tag":186,"props":4881,"children":4882},{"style":193},[4883],{"type":40,"value":483},{"type":34,"tag":186,"props":4885,"children":4886},{"style":199},[4887],{"type":40,"value":926},{"type":34,"tag":186,"props":4889,"children":4890},{"style":193},[4891],{"type":40,"value":493},{"type":34,"tag":186,"props":4893,"children":4894},{"style":496},[4895],{"type":40,"value":935},{"type":34,"tag":186,"props":4897,"children":4898},{"style":199},[4899],{"type":40,"value":504},{"type":34,"tag":186,"props":4901,"children":4902},{"class":188,"line":236},[4903,4907,4911,4915,4919,4923,4927],{"type":34,"tag":186,"props":4904,"children":4905},{"style":193},[4906],{"type":40,"value":483},{"type":34,"tag":186,"props":4908,"children":4909},{"style":716},[4910],{"type":40,"value":2300},{"type":34,"tag":186,"props":4912,"children":4913},{"style":193},[4914],{"type":40,"value":2305},{"type":34,"tag":186,"props":4916,"children":4917},{"style":199},[4918],{"type":40,"value":2310},{"type":34,"tag":186,"props":4920,"children":4921},{"style":193},[4922],{"type":40,"value":493},{"type":34,"tag":186,"props":4924,"children":4925},{"style":496},[4926],{"type":40,"value":2319},{"type":34,"tag":186,"props":4928,"children":4929},{"style":199},[4930],{"type":40,"value":504},{"type":34,"tag":186,"props":4932,"children":4933},{"class":188,"line":249},[4934],{"type":34,"tag":186,"props":4935,"children":4936},{"emptyLinePlaceholder":10},[4937],{"type":40,"value":223},{"type":34,"tag":186,"props":4939,"children":4940},{"class":188,"line":257},[4941,4945,4949,4953,4957],{"type":34,"tag":186,"props":4942,"children":4943},{"style":193},[4944],{"type":40,"value":483},{"type":34,"tag":186,"props":4946,"children":4947},{"style":199},[4948],{"type":40,"value":951},{"type":34,"tag":186,"props":4950,"children":4951},{"style":193},[4952],{"type":40,"value":493},{"type":34,"tag":186,"props":4954,"children":4955},{"style":496},[4956],{"type":40,"value":960},{"type":34,"tag":186,"props":4958,"children":4959},{"style":199},[4960],{"type":40,"value":504},{"type":34,"tag":186,"props":4962,"children":4963},{"class":188,"line":266},[4964,4968,4972,4976,4980],{"type":34,"tag":186,"props":4965,"children":4966},{"style":193},[4967],{"type":40,"value":483},{"type":34,"tag":186,"props":4969,"children":4970},{"style":199},[4971],{"type":40,"value":2365},{"type":34,"tag":186,"props":4973,"children":4974},{"style":193},[4975],{"type":40,"value":493},{"type":34,"tag":186,"props":4977,"children":4978},{"style":496},[4979],{"type":40,"value":2374},{"type":34,"tag":186,"props":4981,"children":4982},{"style":199},[4983],{"type":40,"value":504},{"type":34,"tag":186,"props":4985,"children":4986},{"class":188,"line":279},[4987,4991,4995,4999,5003],{"type":34,"tag":186,"props":4988,"children":4989},{"style":193},[4990],{"type":40,"value":483},{"type":34,"tag":186,"props":4992,"children":4993},{"style":199},[4994],{"type":40,"value":2390},{"type":34,"tag":186,"props":4996,"children":4997},{"style":193},[4998],{"type":40,"value":493},{"type":34,"tag":186,"props":5000,"children":5001},{"style":496},[5002],{"type":40,"value":2399},{"type":34,"tag":186,"props":5004,"children":5005},{"style":199},[5006],{"type":40,"value":504},{"type":34,"tag":186,"props":5008,"children":5009},{"class":188,"line":287},[5010],{"type":34,"tag":186,"props":5011,"children":5012},{"emptyLinePlaceholder":10},[5013],{"type":40,"value":223},{"type":34,"tag":186,"props":5015,"children":5016},{"class":188,"line":296},[5017,5021,5025,5029],{"type":34,"tag":186,"props":5018,"children":5019},{"style":193},[5020],{"type":40,"value":713},{"type":34,"tag":186,"props":5022,"children":5023},{"style":716},[5024],{"type":40,"value":2422},{"type":34,"tag":186,"props":5026,"children":5027},{"style":193},[5028],{"type":40,"value":724},{"type":34,"tag":186,"props":5030,"children":5031},{"style":199},[5032],{"type":40,"value":2431},{"type":34,"tag":186,"props":5034,"children":5035},{"class":188,"line":597},[5036,5040,5044,5048,5052],{"type":34,"tag":186,"props":5037,"children":5038},{"style":199},[5039],{"type":40,"value":2439},{"type":34,"tag":186,"props":5041,"children":5042},{"style":496},[5043],{"type":40,"value":2444},{"type":34,"tag":186,"props":5045,"children":5046},{"style":199},[5047],{"type":40,"value":2449},{"type":34,"tag":186,"props":5049,"children":5050},{"style":496},[5051],{"type":40,"value":2454},{"type":34,"tag":186,"props":5053,"children":5054},{"style":199},[5055],{"type":40,"value":2459},{"type":34,"tag":186,"props":5057,"children":5058},{"class":188,"line":615},[5059,5063,5067,5071,5075],{"type":34,"tag":186,"props":5060,"children":5061},{"style":199},[5062],{"type":40,"value":2439},{"type":34,"tag":186,"props":5064,"children":5065},{"style":496},[5066],{"type":40,"value":2471},{"type":34,"tag":186,"props":5068,"children":5069},{"style":199},[5070],{"type":40,"value":2476},{"type":34,"tag":186,"props":5072,"children":5073},{"style":496},[5074],{"type":40,"value":2481},{"type":34,"tag":186,"props":5076,"children":5077},{"style":199},[5078],{"type":40,"value":2459},{"type":34,"tag":186,"props":5080,"children":5081},{"class":188,"line":624},[5082],{"type":34,"tag":186,"props":5083,"children":5084},{"style":199},[5085],{"type":40,"value":2493},{"type":34,"tag":186,"props":5087,"children":5088},{"class":188,"line":637},[5089],{"type":34,"tag":186,"props":5090,"children":5091},{"emptyLinePlaceholder":10},[5092],{"type":40,"value":223},{"type":34,"tag":186,"props":5094,"children":5095},{"class":188,"line":2503},[5096,5100,5104,5108,5112,5116],{"type":34,"tag":186,"props":5097,"children":5098},{"style":193},[5099],{"type":40,"value":713},{"type":34,"tag":186,"props":5101,"children":5102},{"style":716},[5103],{"type":40,"value":2513},{"type":34,"tag":186,"props":5105,"children":5106},{"style":193},[5107],{"type":40,"value":724},{"type":34,"tag":186,"props":5109,"children":5110},{"style":199},[5111],{"type":40,"value":2522},{"type":34,"tag":186,"props":5113,"children":5114},{"style":527},[5115],{"type":40,"value":2527},{"type":34,"tag":186,"props":5117,"children":5118},{"style":199},[5119],{"type":40,"value":536},{"type":34,"tag":186,"props":5121,"children":5122},{"class":188,"line":2534},[5123,5127,5131],{"type":34,"tag":186,"props":5124,"children":5125},{"style":199},[5126],{"type":40,"value":2540},{"type":34,"tag":186,"props":5128,"children":5129},{"style":527},[5130],{"type":40,"value":2545},{"type":34,"tag":186,"props":5132,"children":5133},{"style":199},[5134],{"type":40,"value":2550},{"type":34,"tag":186,"props":5136,"children":5137},{"class":188,"line":2553},[5138],{"type":34,"tag":186,"props":5139,"children":5140},{"style":199},[5141],{"type":40,"value":2559},{"type":34,"tag":186,"props":5143,"children":5144},{"class":188,"line":2562},[5145],{"type":34,"tag":186,"props":5146,"children":5147},{"style":199},[5148],{"type":40,"value":1237},{"type":34,"tag":186,"props":5150,"children":5151},{"class":188,"line":2570},[5152],{"type":34,"tag":186,"props":5153,"children":5154},{"emptyLinePlaceholder":10},[5155],{"type":40,"value":223},{"type":34,"tag":186,"props":5157,"children":5158},{"class":188,"line":2578},[5159,5163,5167,5171,5175],{"type":34,"tag":186,"props":5160,"children":5161},{"style":193},[5162],{"type":40,"value":713},{"type":34,"tag":186,"props":5164,"children":5165},{"style":716},[5166],{"type":40,"value":983},{"type":34,"tag":186,"props":5168,"children":5169},{"style":193},[5170],{"type":40,"value":724},{"type":34,"tag":186,"props":5172,"children":5173},{"style":527},[5174],{"type":40,"value":992},{"type":34,"tag":186,"props":5176,"children":5177},{"style":199},[5178],{"type":40,"value":997},{"type":34,"tag":186,"props":5180,"children":5181},{"class":188,"line":2602},[5182,5186,5190,5194,5198],{"type":34,"tag":186,"props":5183,"children":5184},{"style":199},[5185],{"type":40,"value":1005},{"type":34,"tag":186,"props":5187,"children":5188},{"style":527},[5189],{"type":40,"value":1010},{"type":34,"tag":186,"props":5191,"children":5192},{"style":199},[5193],{"type":40,"value":734},{"type":34,"tag":186,"props":5195,"children":5196},{"style":496},[5197],{"type":40,"value":1019},{"type":34,"tag":186,"props":5199,"children":5200},{"style":199},[5201],{"type":40,"value":1024},{"type":34,"tag":186,"props":5203,"children":5204},{"class":188,"line":2626},[5205,5209,5213],{"type":34,"tag":186,"props":5206,"children":5207},{"style":199},[5208],{"type":40,"value":1005},{"type":34,"tag":186,"props":5210,"children":5211},{"style":527},[5212],{"type":40,"value":2636},{"type":34,"tag":186,"props":5214,"children":5215},{"style":199},[5216],{"type":40,"value":2641},{"type":34,"tag":186,"props":5218,"children":5219},{"class":188,"line":2644},[5220,5224,5228,5232,5236],{"type":34,"tag":186,"props":5221,"children":5222},{"style":199},[5223],{"type":40,"value":1005},{"type":34,"tag":186,"props":5225,"children":5226},{"style":527},[5227],{"type":40,"value":1036},{"type":34,"tag":186,"props":5229,"children":5230},{"style":199},[5231],{"type":40,"value":734},{"type":34,"tag":186,"props":5233,"children":5234},{"style":496},[5235],{"type":40,"value":1045},{"type":34,"tag":186,"props":5237,"children":5238},{"style":199},[5239],{"type":40,"value":744},{"type":34,"tag":42,"props":5241,"children":5242},{},[5243],{"type":40,"value":2670},{"type":34,"tag":42,"props":5245,"children":5246},{},[5247,5248,5253],{"type":40,"value":2675},{"type":34,"tag":84,"props":5249,"children":5251},{"className":5250},[],[5252],{"type":40,"value":2681},{"type":40,"value":2683},{"type":34,"tag":176,"props":5255,"children":5256},{"className":1352,"code":2686,"language":16,"meta":7,"style":7},[5257],{"type":34,"tag":84,"props":5258,"children":5259},{"__ignoreMap":7},[5260,5267,5294,5301,5308,5315,5322,5329,5336,5351,5358,5365],{"type":34,"tag":186,"props":5261,"children":5262},{"class":188,"line":189},[5263],{"type":34,"tag":186,"props":5264,"children":5265},{"style":230},[5266],{"type":40,"value":2698},{"type":34,"tag":186,"props":5268,"children":5269},{"class":188,"line":205},[5270,5274,5278,5282,5286,5290],{"type":34,"tag":186,"props":5271,"children":5272},{"style":199},[5273],{"type":40,"value":1262},{"type":34,"tag":186,"props":5275,"children":5276},{"style":1265},[5277],{"type":40,"value":2710},{"type":34,"tag":186,"props":5279,"children":5280},{"style":716},[5281],{"type":40,"value":2715},{"type":34,"tag":186,"props":5283,"children":5284},{"style":199},[5285],{"type":40,"value":1278},{"type":34,"tag":186,"props":5287,"children":5288},{"style":496},[5289],{"type":40,"value":2724},{"type":34,"tag":186,"props":5291,"children":5292},{"style":199},[5293],{"type":40,"value":1288},{"type":34,"tag":186,"props":5295,"children":5296},{"class":188,"line":24},[5297],{"type":34,"tag":186,"props":5298,"children":5299},{"style":199},[5300],{"type":40,"value":2736},{"type":34,"tag":186,"props":5302,"children":5303},{"class":188,"line":226},[5304],{"type":34,"tag":186,"props":5305,"children":5306},{"style":199},[5307],{"type":40,"value":2744},{"type":34,"tag":186,"props":5309,"children":5310},{"class":188,"line":236},[5311],{"type":34,"tag":186,"props":5312,"children":5313},{"style":199},[5314],{"type":40,"value":2752},{"type":34,"tag":186,"props":5316,"children":5317},{"class":188,"line":249},[5318],{"type":34,"tag":186,"props":5319,"children":5320},{"style":199},[5321],{"type":40,"value":2760},{"type":34,"tag":186,"props":5323,"children":5324},{"class":188,"line":257},[5325],{"type":34,"tag":186,"props":5326,"children":5327},{"style":199},[5328],{"type":40,"value":2768},{"type":34,"tag":186,"props":5330,"children":5331},{"class":188,"line":266},[5332],{"type":34,"tag":186,"props":5333,"children":5334},{"style":199},[5335],{"type":40,"value":2776},{"type":34,"tag":186,"props":5337,"children":5338},{"class":188,"line":279},[5339,5343,5347],{"type":34,"tag":186,"props":5340,"children":5341},{"style":199},[5342],{"type":40,"value":1322},{"type":34,"tag":186,"props":5344,"children":5345},{"style":1265},[5346],{"type":40,"value":2710},{"type":34,"tag":186,"props":5348,"children":5349},{"style":199},[5350],{"type":40,"value":1288},{"type":34,"tag":186,"props":5352,"children":5353},{"class":188,"line":287},[5354],{"type":34,"tag":186,"props":5355,"children":5356},{"emptyLinePlaceholder":10},[5357],{"type":40,"value":223},{"type":34,"tag":186,"props":5359,"children":5360},{"class":188,"line":296},[5361],{"type":34,"tag":186,"props":5362,"children":5363},{"style":230},[5364],{"type":40,"value":2806},{"type":34,"tag":186,"props":5366,"children":5367},{"class":188,"line":597},[5368,5372,5376,5380,5384],{"type":34,"tag":186,"props":5369,"children":5370},{"style":199},[5371],{"type":40,"value":1262},{"type":34,"tag":186,"props":5373,"children":5374},{"style":1265},[5375],{"type":40,"value":2818},{"type":34,"tag":186,"props":5377,"children":5378},{"style":199},[5379],{"type":40,"value":1306},{"type":34,"tag":186,"props":5381,"children":5382},{"style":1265},[5383],{"type":40,"value":2818},{"type":34,"tag":186,"props":5385,"children":5386},{"style":199},[5387],{"type":40,"value":1288},{"type":34,"tag":169,"props":5389,"children":5390},{"id":2833},[5391],{"type":40,"value":2836},{"type":34,"tag":138,"props":5393,"children":5394},{},[5395,5404,5426],{"type":34,"tag":142,"props":5396,"children":5397},{},[5398,5403],{"type":34,"tag":84,"props":5399,"children":5401},{"className":5400},[],[5402],{"type":40,"value":2848},{"type":40,"value":2850},{"type":34,"tag":142,"props":5405,"children":5406},{},[5407,5408,5413,5414,5419,5420,5425],{"type":40,"value":2855},{"type":34,"tag":84,"props":5409,"children":5411},{"className":5410},[],[5412],{"type":40,"value":2861},{"type":40,"value":2863},{"type":34,"tag":84,"props":5415,"children":5417},{"className":5416},[],[5418],{"type":40,"value":2869},{"type":40,"value":2871},{"type":34,"tag":84,"props":5421,"children":5423},{"className":5422},[],[5424],{"type":40,"value":2877},{"type":40,"value":2879},{"type":34,"tag":142,"props":5427,"children":5428},{},[5429,5430,5435,5436,5441],{"type":40,"value":2884},{"type":34,"tag":84,"props":5431,"children":5433},{"className":5432},[],[5434],{"type":40,"value":2890},{"type":40,"value":2892},{"type":34,"tag":84,"props":5437,"children":5439},{"className":5438},[],[5440],{"type":40,"value":2898},{"type":40,"value":2900},{"type":34,"tag":42,"props":5443,"children":5444},{},[5445,5446],{"type":40,"value":2905},{"type":34,"tag":2148,"props":5447,"children":5448},{},[5449],{"type":34,"tag":313,"props":5450,"children":5452},{"href":2911,"rel":5451},[317],[5453],{"type":40,"value":2915},{"type":34,"tag":47,"props":5455,"children":5456},{"id":2918},[5457],{"type":40,"value":2921},{"type":34,"tag":42,"props":5459,"children":5460},{},[5461,5462],{"type":40,"value":2926},{"type":34,"tag":2148,"props":5463,"children":5464},{},[5465],{"type":34,"tag":313,"props":5466,"children":5468},{"href":2932,"rel":5467},[317],[5469],{"type":40,"value":2936},{"type":34,"tag":2938,"props":5471,"children":5472},{},[5473],{"type":40,"value":2942},{"title":7,"searchDepth":205,"depth":205,"links":5475},[5476,5477,5478,5479,5480,5493,5498],{"id":17,"depth":205,"text":51},{"id":59,"depth":205,"text":62},{"id":16,"depth":205,"text":96},{"id":128,"depth":205,"text":131},{"id":164,"depth":205,"text":167,"children":5481},[5482,5483,5484,5485,5486,5487,5488,5489,5490,5491,5492],{"id":171,"depth":24,"text":174},{"id":324,"depth":24,"text":327},{"id":357,"depth":24,"text":360},{"id":662,"depth":24,"text":665},{"id":875,"depth":24,"text":878},{"id":1092,"depth":24,"text":1095},{"id":1333,"depth":24,"text":1336},{"id":1513,"depth":24,"text":1516},{"id":1609,"depth":24,"text":1612},{"id":1832,"depth":24,"text":1835},{"id":1868,"depth":24,"text":1871},{"id":2133,"depth":205,"text":2136,"children":5494},[5495,5496,5497],{"id":2160,"depth":24,"text":2163},{"id":2185,"depth":24,"text":2188},{"id":2833,"depth":24,"text":2836},{"id":2918,"depth":205,"text":2921},1762724245883]