Giter Club home page Giter Club logo

webpack-handbook's Introduction

Webpack 中文指南

Join the chat at https://gitter.im/zhaoda/webpack-handbook

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

主站 · 下载电子版

贡献内容

如果你想参与这本书的共同创作,修改或添加内容,可以先 Fork 这本书的仓库,然后将修改的内容提交 Pull requests ;或者创建 Issues

Fork 后的仓库如何同步本仓库?

// 添加 upstream 源,只需执行一次
$ git remote add upstream [email protected]:zhaoda/webpack-handbook.git

// 拉取远程代码
$ git pull upstream master

// 提交修改
$ git add .
$ git commit

// 更新 fork 仓库
$ git push origin master

更多参考: Syncing a fork

注意,本书内容在 /content 目录中, /docsWiki 版是通过脚本自动生成的。

生成电子书

这本书使用 Gitbook 撰写并生成网站,请查看 package.json 中的 scripts 配置和 /scripts 目录中的脚本来了解这本书的构建和发布过程。

// 初始化 nodejs 依赖
$ npm install

// 安装 gitbook 插件
$ npm install gitbook-cli -g
$ gitbook install ./content

// 启动 gitbook 服务开始撰写工作
$ npm run serve-gitbook

// 生成 gitbook
$ npm run generate-gitbook

// 生成 wiki
$ npm run generate-wiki

// 发布到 wiki
$ npm run deploy-wiki

// 生成并发布,是上面3条命令的快捷方式,通常编辑内容后只需要进行这个操作
$ npm run generate-and-deploy

更新日志

https://github.com/zhaoda/webpack-handbook/commits/master

版权许可

Webpack 中文指南赵达 创作,采用 知识共享 署名-非商业性使用 4.0 国际 许可协议进行许可。

webpack-handbook's People

Contributors

a407121393 avatar chriswong avatar fiercewindv avatar gitter-badger avatar haoliangyu avatar iceli avatar invinciblezz avatar nfang avatar sdutwsl avatar xqin avatar zhangjd avatar zhaoda avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

webpack-handbook's Issues

一个错别字

通过一个 socket.io 服务实 监听它们的变化并自动刷新页面

执行代码报错,望解答

{test: /\.css$/, loader: 'style!css'}

执行webpack命令时报错

ERROR in ./entry.js
Module not found: Error: Can't resolve 'style' in '/home/lethe/work/xinhua-backstage'
BREAKING CHANGE: It's no longer allowed to omit the '-loader' suffix when using loaders.
                 You need to specify 'style-loader' instead of 'style'.
 @ ./entry.js 1:0-22

ERROR in ./entry.js
Module not found: Error: Can't resolve 'style' in '/home/lethe/work/xinhua-backstage'
BREAKING CHANGE: It's no longer allowed to omit the '-loader' suffix when using loaders.
                 You need to specify 'style-loader' instead of 'style'.
 @ ./entry.js 2:0-22

我从网上查了,将{test: /\.css$/, loader: 'style!css'}改为 { test: /\.css$/, loader: "style-loader!css-loader" }可以正常运行,但是不知道原因,麻烦帮忙解答下,万分感谢@zhaoda

问个关于webpack的问题

跟着您翻译的文章走,如果是在webpack.config.js配置文件中加入了css相关的loader,并且在入口文件中引入了css模块,则会直接报错Module not found...配置文件都很简单,不加css相关的都不会报错,请问您知道这个问题的原因吗?不使用配置文件方式的话倒是可行的;我看了一下css-loader,里面的module非常多,文件目录也很深,所以是不是因为win7对文件路径256字符限制导致模块不能正常加载呢?英文不好,只好来问您了。 : (

疑问于该项目

这个项目是一本书么,主要是中文??这里是开源平台,我可以问下,作者初衷是什么么??

2.3 Loader CSS绑定类型错误

原文最后一部分编译有误
$ webpack entry.js bundle.js --module-bind 'css=style!css'

应为
$ webpack entry.js bundle.js --module-bind "css=style!css"

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.