zoukankan      html  css  js  c++  java
  • webpack 使用

    首先创建一个静态页面 index.html 和一个 JS 入口文件 entry.js:

    <!-- index.html -->
    <html>
    <head>
      <meta charset="utf-8">
    </head>
    <body>
      <script src="bundle.js"></script>
    </body>
    </html>
    
    // entry.js
    document.write('It works.')
    

    然后编译 entry.js 并打包到 bundle.js:

    $ webpack entry.js bundle.js
    

    打包过程会显示日志:

    Hash: e964f90ec65eb2c29bb9
    Version: webpack 1.12.2
    Time: 54ms
        Asset     Size  Chunks             Chunk Names
    bundle.js  1.42 kB       0  [emitted]  main
       [0] ./entry.js 27 bytes {0} [built]
    

    用浏览器打开 index.html 将会看到 It works. 。

    接下来添加一个模块 module.js 并修改入口 entry.js

    // module.js
    module.exports = 'It works from module.js.'
    
    // entry.js
    document.write('It works.')
    document.write(require('./module.js')) // 添加模块
    

    重新打包 webpack entry.js bundle.js 后刷新页面看到变化 It works.It works from module.js.

    Hash: 279c7601d5d08396e751
    Version: webpack 1.12.2
    Time: 63ms
        Asset     Size  Chunks             Chunk Names
    bundle.js  1.57 kB       0  [emitted]  main
       [0] ./entry.js 66 bytes {0} [built]
       [1] ./module.js 43 bytes {0} [built]
    

    Webpack 会分析入口文件,解析包含依赖关系的各个文件。这些文件(模块)都打包到 bundle.js 。Webpack 会给每个模块分配一个唯一的 id 并通过这个 id 索引和访问模块。在页面启动时,会先执行 entry.js 中的代码,其它模块会在运行 require 的时候再执行。

  • 相关阅读:
    Datasnap http用户验证
    Delphi 接口机制真相
    tfmxobject的序列化
    delphi md5算法
    delphi xe 窗体子控件实现窗体拖动
    Delphi笔记-自定义组件
    DELPHI RES资源文件使用方法
    Delphi中WebBrowser的使用技巧汇总
    Delphi XE调用第三方库Jni详细过程
    使用VLC进行屏幕广播
  • 原文地址:https://www.cnblogs.com/ExMan/p/6758481.html
Copyright © 2011-2022 走看看