GithubHelp home page GithubHelp logo

huangy1987 / devopenclub-tech-webpack2 Goto Github PK

View Code? Open in Web Editor NEW

This project forked from parryqiu/devopenclub-tech-webpack2

0.0 2.0 0.0 18.91 MB

Webpack 2 视频教程课程源码

Home Page: https://devopen.club/course/webpack

JavaScript 90.70% HTML 5.02% CSS 4.28%

devopenclub-tech-webpack2's Introduction

截图

这是我免费发布的高质量超清「Webpack 2 视频教程」。

Webpack 作为目前前端开发必备的框架,Webpack 发布了 2.0 版本,此视频就是基于 2.0 的版本讲解的。

这个基本就是目前国内最完整的 Webpack 2.0 学习视频了,希望可以对新手或者复习相关知识的朋友有用。

源码中包含了课程中的思维导图源文件,使用的思维导图软件为 Mac 下的 iThoughtsX 。

课程地址: https://devopen.club/course/webpack

Webpack 是当下最热门的前端资源模块化管理和打包工具。 它可以将许多松散的模块按照依赖和规则打包成符合生产环境部署的前端资源。 还可以将按需加载的模块进行代码分隔,等到实际需要的时候再异步加载。 通过loader的转换,任何形式的资源都可以视作模块,比如 CommonJs 模块、 AMD 模块、 ES6 模块、CSS、图片、 JSON、Coffeescript、 LESS 等。

1. 视频课程简介

  • 001 - Webpack 简介
  • 002 - NodeJS 安装与配置
  • 003 - Webpack 项目初始化
  • 004 - Webpack 初体验
  • 005 - Webpack 编译输出日志
  • 006 - 使用快捷方式进行编译
  • 007 - 配置 WDS 进行浏览器自动刷新
  • 008 - WDS 端口号等配置相关
  • 009 - 配置 ESLint 实现代码规范自动测试 (上)
  • 010 - 配置 ESLint 实现代码规范自动测试 (下)
  • 011 - Webpack2 中加载 CSS 的相关配置与实战
  • 012 - 理解 Webpack 中的 CSS 作用域与 CSS Modules
  • 013 - 自动分离 CSS 到独立文件
  • 014 - 深入理解 Webpack 2 中的 loader
  • 015 - Webpack 2 中的文件压缩
  • 016 - Webpack 2 中生成 SourceMaps
  • 017 - Webpack 2 中分离打包项目代码与组件代码
  • 018 - 使用可视化图表进行统计分析打包过程
  • 019 - Webpack 2 中配置多页面编译
  • 020 - Webpack 2 中的 HMR (Hot Module Replacement)

课程暂时完结。

稍后会根据小密圈问题以及官方发布 Webpack 3 后进行适当地更新。

关于课程的任何问题,都可以在我们的高质量前端开发小密圈中提问与交流。

课程更新及高质量讨论地址:https://devopen.club/course/webpack

2. 视频课程地

  • Webpack 2 前端开发教程优酷完整播单

http://list.youku.com/albumlist/show?id=49394464&ascending=1&page=1

  • Webpack 2 前端开发教程 Youtube 完整播单

https://www.youtube.com/playlist?list=PLXbU-2B80FvDu2YTKN42WvAVKWHs6XHRy

3. 课程与前端相关的高质量讨论群

课程更新及高质量讨论小密圈地址:https://devopen.club/course/webpack

devopenclub-tech-webpack2's People

Contributors

parryqiu avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.