WebPACKの置き換えローカルサーバのホットモジュールの電源をオン

ステップ

1、最初のグローバルサーバーをインストール

npm install webpack-dev-server -g

2、部分的なダウンロード

npm install webpack-dev-server -D

3.サーバの電源を入れ

ページの更新をトリガするすべてのプロファイルを除くすべてのファイルを聞くために行われ（グローバル更新）

webpack-dev-server

図4に示すように、適切に配置され

devServer:{
    port: "8090",
    //切换端口号
    contentBase:'dist'
    //默认打开路径
}

5、直接ブラウザを開き

webpack-dev-server --open --color

--------------------

モックデータ

ディレクトリ内のファイルを作成します。data.json

次のようにデータを要求するステップであります

//首先在本地开发环境中单独引用数据
var json = require('数据文件名');
//当json文件置于dist文件下则相当于放在了服务器下 可以利用ajax请求
//引入JQ
import $ from jquery  
//注意npm下载
$.ajax({


})

----------------------------

ホットモジュール交換するホット・アップデートパーシャルリフレッシュ

以下のような構成は以下のとおりです。

 

//该插件是webpack自带的  默认对lesscss生效
var webpack = require('webpack');

plugins:[

    new webpack.HotModuleReplacementPlugin();

],
devServer:{

    hot:true
}
//对于js来讲 入口文件中添加如下


if(module.hot) {
    module.hot.accept();
}

ホット更新原理

実行中のアプリケーションを作る際に、あなたは、リフレッシュ更新をリロード追加し、モジュールのメカニズムを削除することはできません

私が説明すると言うだろう、ある  ページを更新せず、状況が容易開発者のために、アプリケーション開発環境では、コードを変更して、視覚的にページ・メカニズムの変化を見ることができます

データが発生したか否かとき更新間隔熱hot--送信モニターに要求をパッケージ化ホット更新にコードのコードセクションの添加が行われた後

再コンパイルのページへの変更を処理する後に、コードの変更を再ダウンロードします