vue第三单元(webpack的应用-能根据具体的需求构建对应的开发环境)

第三单元(webpack的应用-能根据具体的需求构建对应的开发环境)

#课程目标

1. 理解什么是单页面应用。
2. 掌握单页面和多页面的差异。
3. 了解单页面的实现原理。
4. 掌握模块化的方式实现webpack配置，区分线上环境和开发环境，能够快速切换对应的配置。

#知识点

1. 单页面应用（spa），是仅仅使用一个html页面，结合javaScript以及页面url地址模拟出多页面的页面跳转效果。

2. 要实现单页面应该要解决的几个问题是

   • 如何建立视图和url地址的对应关系
   • 如何更加方便的表示并且管理视图
   • 如何通过javaScript改变url地址，但是不让页面向服务端发起请求
   • 如何监听url地址的变化

3. 学习使用webpack-merge，根据不同的环境编写不同的配置，可以复用公共的配置。

4. 使用以下目录结构去编写webpack配置

-- webpackConfig
    -- config.js
    -- webapck.base.js
    -- webpack.dev.js
    -- webpack.devServer.js
    -- webpack.pro.js

 

#授课思路

#案例和作业

1. 自己定义单页面的开发方式

2. 使用webpack搭建出一个单页面的应用程序的开发环境