小試牛刀之webpack dev server

2021-10-06 13:32:35 字數 2668 閱讀 1644

模組熱替換

用express搭建過乙個小型的伺服器,用過監聽模式來解決手動npm run build的麻煩,這次使用webpack-dev-server來搭建乙個伺服器,且一併解決「手動編譯、手動重新整理瀏覽器」的麻煩。

**目錄

詳細**

"root"

>

<

/div>

<

/body>

<

/html>

import

from

"./math.js"

;var sum =

add(1,

2);var diff =

sub(2,

1);var product =

mul(1,

2);var quotient =

div(2,

1);document.

queryselector

("#root"

).textcontent =

[sum,diff,product,quotient]

.join

("||"

);

const

add=

(x,y)

=> x+y;

const

sub=

(x,y)

=> x-y;

const

mul=

(x,y)

=> x*y;

const

div=

(x,y)

=> x/y;

export

const path =

require

("path");

const

=require

("clean-webpack-plugin");

const htmlwebpackplugin =

require

('html-webpack-plugin');

module.exports =

, output:

, plugins:

[new

cleanwebpackplugin()

,new

htmlwebpackplugin()

]}

,"devdependencies"

:}

測試
npm run start
引數及說明

在配置檔案中實現

devserver:

在命令列中實現

第一次嘗試

第二次嘗試

if(module.hot)

)}

第三次嘗試

上面,我們看到了 js模組 是怎麼實現 模組熱替換的。這次我們來看看 css模組。

新增index.css,並在index.js中引入index.css,當然webpack.config.js裡還得用上style-loadercss-loader

是,index.js中沒有module.hot.accept("./index.css,callback),但style-loader裡有。

boost graph lib 小試牛刀

最近要做社會網路的社群發現,發現用bgl能減少不少 量。經過一番調研發現bgl封裝的很牛叉,dijkstra等演算法統統具備,奈何自己對泛型程式設計不太熟,遇到問題還是很糾結。primer泛型程式設計 演算法部分和stl原始碼分析接下來有時間一定要讀下。下面僅以鄰接鍊錶和自定義節點為例 typede...

Anti Debug 小試牛刀

本文整理了日常生活中遇到的一些anti debug技術,除非特殊說明,均適用於mac ios開發 作為第一篇正式博文,會不定期更新,謝謝大家.123 4567 89 define pt deny attach 31 include intmain 程式正常執行,會輸出hello 但是程式載入到gdb...

tsung小試牛刀

linux環境 centos5.5 1 tsung安裝 tar zxvf tsung 1.4.2.tar.gz configure make sudo make install 安裝後執行 which tsung,如果顯示 usr bin tsung 表明安裝成功 2 設定 如果沒有 tsung 目...