首页 > Web开发 > 详细

重温webpack(一)

时间:2019-09-15 23:00:01      阅读:120      评论:0      收藏:0      [点我收藏+]

webpack.*

webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。当 webpack 处理应用程序时,它会递归地构建一个依赖关系图(dependency graph),其中包含应用程序需要的每个模块,然后将所有这些模块打包成一个或多个 bundle

技术分享图片

https://www.webpackjs.com/concepts/modules/

立即开始:

 

mkdir webpack-demo && cd webpack-demo
npm init -y
npm install webpack webpack-cli --save-dev

目录
  webpack-demo
  |- package.json
+ |- index.html
+ |- /src
+   |- index.js

 

技术分享图片

 

 

技术分享图片

 

 

project

 

  webpack-demo
  |- package.json
+ |- /dist
+   |- index.html
- |- index.html
  |- /src
    |- index.js

 

要在 index.js 中打包 lodash 依赖,我们需要在本地安装 library:

 

npm install --save lodash

dist/index.html

  <!doctype html>
  <html>
   <head>
     <title>起步</title>
-    <script src="https://unpkg.com/lodash@4.16.6"></script>
   </head>
   <body>
-    <script src="./src/index.js"></script>
+    <script src="main.js"></script>
   </body>
  </html>

技术分享图片

 

 

 

 

重温webpack(一)

原文:https://www.cnblogs.com/pikachuworld/p/11524287.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!