知识点小总结

HTML部分

• 浏览器显示形式区分
  • 块级元素
  • 行内元素
• 元素特点区分
  • 替换元素
  • 非替换元素
• H5新特性
  • 语义化元素 article、footer、header、nav、section
  • 表单新控件 calendar、date、time、email、url、search
  • 桌面通知 Notifications
  • 新增选择器 document.querySelector、document.querySelectorAll
  • 拖拽释放(Drag and drop) API
  • 多任务 webworker
  • 全双工通信协议 websocket
  • 媒体播放 video、audio
  • 地理位置 Geolocation
  • 本地储存sessionStorage、localStorage
  • 离线web应用 manifest
  • 页面可见性改变事件 visibilitychange
  • 跨窗口通信 PostMessage
  • 跨域资源共享(CORS) Access-Control-Allow-Origin
  • 历史管理 history
  • 绘画 canvas
  • Form Data 对象

CSS部分

• 参考手册：http://www.css88.com/book/css/
• 预处理器：less、sass、stylus
• UI框架：element ui、iview ui等；
• 图表库：font-awesome

JS部分

• 语法
  • 变量声明：var、let、const
  • 解构赋值
  • async function
  • await（一般用于Promise，且只能在async function中使用）
  • function* ()
• DOM操作
• js数据类型
  • 基本类型：Number、Boolean、String、undefined、null、Symbol
  • 引用类型：Object、Array、Date、RegExp、Function、Map、Set、WeakMap、WeakSet、Error、Promise、Generator、Proxy（Reflect）;
• 函数
  • Arguments 对象
  • 箭头函数
  • getter、setter
• 继承和原型链
• 内存管理
• 严格模式
• 并发模型、事件循环

Webpack部分

• entry入口
  • 单入口
  • 多入口
• output输出
  • filename: 输出文件的文件名
  • path: 输出文件的目标路径（储存在本地的文件路径）
  • publicPath: 输出解析文件的目录（相对于HTML页面的url路径）
• resolve解析
  • alias：import 或 require 的别名
  • extensions：自动解析确定的扩展
  • modules：解析模块时应该搜索的目录
  • plugins：应该使用的额外的解析插件列表
  • mainFiles：解析目录时要使用的文件名
• module模块
  • rules：创建模块时，匹配请求的规则数组
    • test：匹配的正则规则
    • parser：解析的对象
    • loader：匹配到后用于解析的loader
      • file-loader 将文件发送到输出文件夹，并返回（相对）URL
      • url-loader 像 file loader 一样工作，但如果文件小于限制，可以返回 data URL
      • json-loader 加载 JSON 文件（默认包含）
      • babel-loader 加载 ES2015+ 代码，然后使用 Babel 转译为 ES5
      • html-loader 导出 HTML 为字符串，需要引用静态资源
      • markdown-loader 将 Markdown 转译为 HTML
      • style-loader 将模块的导出作为样式添加到 DOM 中
      • css-loader 解析 CSS 文件后，使用 import 加载，并且返回 CSS 代码
      • less-loader 加载和转译 LESS 文件
      • sass-loader 加载和转译 SASS/SCSS 文件
      • postcss-loader 使用 PostCSS 加载和转译 CSS/SSS 文件
      • stylus-loader 加载和转译 Stylus 文件
      • eslint-loader PreLoader，使用 ESLint 清理代码
      • vue-loader 加载和转译 Vue 组件
      • angular2-template-loader 加载和转译 Angular 组件
    • loaders：匹配到后用于解析的loader数组
    • include：解析的文件目录
    • exclude：不解析的文件目录
    • use：应用于模块的 UseEntries 列表
• pugins插件
  • CommonsChunkPlugin 提取 chunks 之间共享的通用模块
  • HtmlWebpackPlugin 简单创建 HTML 文件，用于服务器访问
  • LimitChunkCountPlugin 设置 chunk 的最小/最大限制，以微调和控制 chunk
  • ExtractTextWebpackPlugin 将所有的入口 chunk(entry chunks)中引用的 *.css，移动到独立分离的 CSS 文件
  • DefinePlugin 创建一个在编译时可以配置的全局常量
  • UglifyjsWebpackPlugin 压缩ES6
• devServer(开发工具)