前言

問題解決了，特來反哺社區(qū)

先總結(jié)一下。HashedModuleIdsPlugin用于穩(wěn)定 ModuleId 的，我問的問題核心是 生成穩(wěn)定的ChunkId，這兩者是不一樣的。

如何生成穩(wěn)定ModuleId

表現(xiàn):

只修改了 home/index.js 的代碼，但在最終的構(gòu)建結(jié)果中，vendor.js 的文件指紋也被修改了

原因有兩個:

1. webpack runtime (運行時) 中包含 chunks ID 及其對應(yīng) chunkhash 的對象，但 runtime 被集成到 vendor.js 中。
2. entry 內(nèi)容修改后，由于 webpack 的依賴收集規(guī)則導(dǎo)致構(gòu)建產(chǎn)生的 entry chunk 對應(yīng)的 ID 發(fā)生變化，webpack runtime 也因此被改變。

解決辦法:

1. 使用CommonsChunkPlugin 繼續(xù)將webpack runtime抽離出來
   
2. 使用HashedModuleIdsPlugin代替原有的ModuleId根據(jù)依賴的收集順序遞增的正整數(shù)生成規(guī)則。

順便一提，生成穩(wěn)定的ModuleId在官方文檔 - 緩存中有提及

早前經(jīng)過合理的配置(可以參考用 webpack 實現(xiàn)持久化緩存，實現(xiàn)了其他模塊變動后，vendor.js的文件指紋不會發(fā)生變化的效果)

效果如下:

如何生成穩(wěn)定的ChunkId

很多文章都只介紹到如何生成穩(wěn)定的ModuleId，沒有提到生成穩(wěn)定的ChunkId

后來經(jīng)過 @dahoshaw的提醒

可以看下Webpack的源碼，Webpack是根據(jù)模塊的順序遞增chunkid，源代碼中的applyChunkIds函數(shù),所以官方有提供NamedChunksPlugin插件來根據(jù)文件名來穩(wěn)定你的chunkid

webpackJsonp有三個參數(shù)，每次有新的entry加入說明資源數(shù)增加了，Chunk數(shù)量也會跟著增加。ChunkId也會遞增

這有點類似ModuleId遞增變動導(dǎo)致的文件指紋變化而導(dǎo)致的長效緩存失效

他推薦的文章 Predictable long term caching with Webpack確實寫的不錯!

解決辦法:

在生產(chǎn)環(huán)境中的Webpack配置添加plugin: NamedChunksPlugin

// 使用模塊名稱作為chunkid,替換掉原本的使用遞增id來作為chunkid導(dǎo)致的[新增entry模塊,其他模塊的hash發(fā)生抖動,導(dǎo)致客戶端長效緩存失效]
config.plugins.push(new webpack.NamedChunksPlugin((chunk) => {
  // 解決異步模塊打包的問題
  if (chunk.name) {
    return chunk.name;
  }
  return chunk.modules.map(m => path.relative(m.context, m.request)).join("_");
}));

最后驗證一下，我們先打包一下項目，打包結(jié)果結(jié)構(gòu)如下:

dist
├── home
│?? ├── haha.dc494f13ed558999751e.js
│?? ├── index.2266d24e04004acaa5a6.css
│?? └── index.2b15fbd2daa6c833f5d5.js
├── manifest.json
├── runtime.1de86da7006780a96879.js
├── static
│?? └── images
│??     ├── logo-ea7f33f9bddceac362c1d7f378043187.png
│??     └── share-icon-881a5a400142ab60684b3cec860611b4.png
├── sub-home
│?? ├── haha.141284e7095f605726ac.js
│?? ├── index.7039775e1ba458814d14.js
│?? └── index.efd6d51187ec8a058fe6.css
└── vendor.dee373a1cd36f461d200.js

4 directories, 11 files

假設(shè)我們打算新增sub-sub-home模塊。新增這個模塊后打包結(jié)果結(jié)構(gòu)如下:

dist
├── home
│?? ├── haha.dc494f13ed558999751e.js
│?? ├── index.2266d24e04004acaa5a6.css
│?? └── index.2b15fbd2daa6c833f5d5.js
├── manifest.json
├── runtime.1de86da7006780a96879.js
├── static
│?? └── images
│??     ├── logo-ea7f33f9bddceac362c1d7f378043187.png
│??     └── share-icon-881a5a400142ab60684b3cec860611b4.png
├── sub-home
│?? ├── haha.141284e7095f605726ac.js
│?? ├── index.7039775e1ba458814d14.js
│?? └── index.efd6d51187ec8a058fe6.css
├── sub-sub-home
│?? ├── haha.6501ce2d3a138709282b.js
│?? ├── index.c367ca84bd261f36f050.js
│?? └── index.efd6d51187ec8a058fe6.css
└── vendor.dee373a1cd36f461d200.js

5 directories, 14 files

至此，通過Webpack實現(xiàn)長效緩存實踐完美收官。

參考

知乎 - webpack 每次打包公用vendor 每次hash都會變化，有辦法解決嗎？

用 webpack 實現(xiàn)持久化緩存

Predictable long term caching with Webpack

官方文檔 - 緩存

你可以自己寫一層DIV 樣式寫成element tooltip，隱藏，并且內(nèi)容全部顯示，可以換行。
位置也固定在收件地址哪行上方，可以適當(dāng)覆蓋一些，鼠標(biāo)移動上去，顯示隱藏的div不就行了？

let addValue = function(json,key,value){

for(let i in json){
    if(typeof json === "object"){
        addValue(json[i],key,value);
    }
}
json[key] = value;

}
addValue(json,'node','node');

第一瀏覽器你打開一個doc文件。 什么功能下載？還是?
還有你 這個前面本地host 后面加上http:// 你覺得你路徑對嗎?
最后一個路徑 下面這個上面console 的路徑是什么  bank前面目錄是什么?為什么截取bank以及它之后
404肯定是你路徑的問題 這個問的 誰也不能直接幫你找出答案

document.body.innerHTML='<img src="123.jpg">'

你新建一個工程打包下是否成功，如果不成功是你環(huán)境的問題。
也有可能是cordova ionic沒有安裝成功，我以前安裝成功都需要科學(xué)上網(wǎng)的。

同問這個問題，目前只會手動創(chuàng)建表之后再用Sequelize API進行數(shù)據(jù)讀寫。
假如基于Sequelize的model對應(yīng)了一個新表，執(zhí)行起來直接就會報“該新表不存在”的錯。

那么請問怎樣直接進行表的操作呢？像下面這樣調(diào)用Sequelize的sync( )方法好像也不管用??？

const model = require('./model.js');
model.sync();

console.log('init db ok.');
process.exit(0);

指定原因了，我寫了一個最小限制，所以沒有生成臨時文件

array.reduce(function(sum,item){return sum += +item[1] },0)

給text一個寬度就好了，比如4em。

太感謝@勤奮的小小塵，完全解決了心中的疑慮，果然如此。我這的VPN用不了了，某度又找不準(zhǔn)想要的。真是千恩萬謝

你的json數(shù)據(jù)有多少層最好固定， 有多少層就寫多少層的ng-repeat。以前寫過類似的父子結(jié)構(gòu)，不能無限擴展。

你這是寫錯代碼了吧，沒閉合，如果是請求錯誤請看network是否請求了

各種按鈕Hover特效,
各種小動畫,
各種圖片Hover特效,
Css Tricks 玩前端的人如果沒來過這里，那說明你的閱歷還淺。
以上，夠你研究一陣子

不知道最后一位是&用不用去掉
比如

let str = '12341231&';

這種情況用不用將&替換？
如果需要，正則應(yīng)該是

/(&.)|(&$)/g

不需要，就應(yīng)該是樓上那位

/&./g

臨時措施的話，有個軟件叫DnSpy，你可以修改代碼，再變回DLL。

用兩條一模一樣的數(shù)據(jù)

我有個辦法，你可以把你的樣式文件動態(tài)的寫入HTML中，通過link標(biāo)簽來搞，比如說你要加載a.css，就寫個標(biāo)簽

<link rel="stylesheet" href="a.css">

你可以寫個方法，傳入你要加載的css的名字，然后document.head.appendChild(document.createElement('link').href="樣式表名字(地址)")

組件動態(tài)引入不同css

首先你可以拿到webpack編譯的時候的環(huán)境變量，怎么定義的去看這個博客
如果你是用的vue-cli腳手架生成的項目，應(yīng)該會有這么兩個文件去設(shè)置vue環(huán)境變量的，你加上一個A

然后，你找到build文件夾下webpack.base.conf.js

添加一個別名，你引入css的時候，就引入這個別名文件夾下的對應(yīng)的文件，就行了

<template>
  <div id="app">
    <HelloWorld/>
  </div>
</template>

<script>
import HelloWorld from './components/HelloWorld'

import '~theme/a.css'

export default {
  name: 'App',
  components: {
    HelloWorld
  }
}
</script>

<style>
#app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>

在構(gòu)建npm run dev的時候，我試了，好像拿不到process.env.A，不過你可以手動在webpack.base.conf.js里面手動的去賦值一下process.env.A = xxx

同樣遇到這個問題 , 雖然有哥們說修改 webpack.common.conf.js 可以運行成功 但是不知道這樣的修改會造成其他什么問題, 請問有沒有更完美一些的解決方法