Complete Vue.js 2 Web Development_ Practical guide to building end-to-end web development solutions with Vue.js 2

Single Page Applications Chapter 15 The next (false) command will make the user stay where they are, and we also edited the endp ...

Single Page Applications Chapter 15 How to do it... As stated earlier, I will assume that you have all the code resulting from t ...

Single Page Applications Chapter 15 } } }).then(response => { NProgress.done() next(vm => { vm.name = response.data.name v ...

Single Page Applications Chapter 15 It would be better to add a new hook to the router: router.afterEach((to, from) => { NPro ...

Single Page Applications Chapter 15 It's just a page with a link to a clothes listing. Let's register the VueRouter: Vue.use(Vue ...

Single Page Applications Chapter 15 Only by adding that redirect we did save the day. Now, you will be presented with the sales ...

Single Page Applications Chapter 15 Redirecting with parameters You can also retain the parameters while redirecting: { path: '/ ...

Single Page Applications Chapter 15 This is not true when you are in an SPA, or at least is not automatic. The vue-router histor ...

Single Page Applications Chapter 15 router, el: '#app' }) </script> </body> </html> As HTML layout, put this i ...

Single Page Applications Chapter 15 We only need a stub for the home page component: const Home = { template: '<div>Welcom ...

Single Page Applications Chapter 15 To accomplish this, let's modify our router code to the following: const router = new VueRou ...

Single Page Applications Chapter 15 How it works... When you use a URL that contains the hash symbol in the browser, the browser ...

16 Organize + Automate + Deploy = Webpack In this chapter, we will talk about the following topics: Extracting logic from your c ...

Organize + Automate + Deploy = Webpack Chapter 16 Extracting logic from your components to keep the code tidy Vue components can ...

Organize + Automate + Deploy = Webpack Chapter 16 Then, navigate to src/App.vue in the directory structure and delete pretty muc ...

Organize + Automate + Deploy = Webpack Chapter 16 </div> </div> We put the .number modifier, or otherwise the number ...

Organize + Automate + Deploy = Webpack Chapter 16 Now that our application works, you can see how much we will gain by putting 0 ...

Organize + Automate + Deploy = Webpack Chapter 16 How it works... When working in a component or when programming in general, it ...

Organize + Automate + Deploy = Webpack Chapter 16 How to do it... For this recipe, you will build a reusable component that shak ...

Organize + Automate + Deploy = Webpack Chapter 16 /* eslint-disable no-new */ new Vue({ el: '#app', template: ` <div> This ...