zoukankan      html  css  js  c++  java
  • webpack

    import return promise  所以可以与async函数一起用,需要插件

    @babel/plugin-syntax-dynamic-import

     

    It is possible to provide a dynamic expression to import() when you might need to import specific module based on a computed variable later.

     todo https://developer.mozilla.org/en-US/docs/Glossary/CORS

    https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link#attr-crossorigin

    浏览器。 支持preload: 当前页需要使用,下载下来,不执行

    prefetch:下一个navigation可能会使用,在浏览器空闲时间下载下来。

    webpack也支持

    Bundle Analysis    打包分析

     生成解析文件webpack --profile --json > stats.json    使用官方分析工具,等分析

    lazy  loading

    caching

     [name]。[contenthash]  .js

    代码没变,contenthash变了:

    原因:This is because webpack includes certain boilerplate, specifically the runtime and manifest, in the entry chunk.

    解决:Extracting Boilerplate 

    +     runtimeChunk: 'single',

    Lets add optimization.splitChunks with cacheGroups with next params and build:
    optimization: {
          runtimeChunk: 'single',
    +     splitChunks: {
    +       cacheGroups: {
    +         vendor: {
    +           test: /[\/]node_modules[\/]/,
    +           name: 'vendors',
    +           chunks: 'all',
    +         },
    +       },
    +     },
        },

    ... we can see that all three have. This is because each module.id is incremented based on resolving order by default. Meaning when the order of resolving is changed, the IDs will be changed as well. So, to recap:

    • The main bundle changed because of its new content.
    • The vendor bundle changed because its module.id was changed.
    • And, the runtime bundle changed because it now contains a reference to a new module.

     

    +     moduleIds: 'hashed',
    

     

    发布library

    webpack的环境变量 webpack --env.production --env.NODE_ENV=local 

    webpack cli

    在webpack配置里面访问webpack env 需要将module。exports指向函数

  • 相关阅读:
    【动态规划】合唱团
    【动态规划】抄近路
    【动态规划】机器人军团
    【贪心】赶作业
    【贪心】时空定位I
    【贪心】雷达问题
    【贪心】监测点
    【贪心】闭区间问题
    设计与实现
    Hello World
  • 原文地址:https://www.cnblogs.com/miaolq/p/13538808.html
Copyright © 2011-2022 走看看