Webpack2 入門(5)

Webpack2 入門(5)

主要參考官網 Getting Started

本篇內容延續 Webpack2 入門(2)

本篇主要介紹:如何利用 webpack 建立一個開發用的 server

webpack-dev-server

webpack-dev-server 設定

npm install --save-dev webpack-dev-server

在這裡我們利用 Node.js API 執行 dev-server (See here),因此我們就不需在 webpack.config.js 這裡設定 <code>dev-server

建立一個 server.js

server.js

const Webpack = require("webpack");
const WebpackDevServer = require("webpack-dev-server");
const webpackConfig = require("./webpack.config");

const compiler = Webpack(webpackConfig);
const server = new WebpackDevServer(compiler, {
    stats: {
        colors: true
    }
});

server.listen(8080, "127.0.0.1", function() {
    console.log("Starting server on http://localhost:8080");
});

package.json` 加入這段

package.json

{
  ...
  "scripts": {
    "build": "webpack",
    "dev": "node server.js"
  },
  ...
}

執行

$ npm run dev

接下來我們就可以順利連線 http://localhost:8080/

參考

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *