webpack.config.js配置資訊的說明

module.exports = {
  entry: "./src/main.js",
  output: {
    filename: "build/build.js"
  },
  module: {
    loaders: [
       //.css 檔案使用 style-loader 和 css-loader 來處理
      { test: /.css$/, loader: "style!css" },
      //.js 檔案使用 jsx-loader 來編譯處理
      { test: /.js$/,    loader: "jsx-loader" }
    ]
  },
  resolve: {
    extensions: ['', '.js', '.jsx']
  },
  plugins: []
};      

entry: 頁面中的入口檔案，可以是字元串路徑'./src/main.js'，也可以是數組['./a.js','./b.js']，還可以是對象{main: './a.js',home: './b.js'}；

output:頁面通過webpack打包後生成的目标檔案放在什麼地方去，我這邊是在根目錄下生成build檔案夾，該檔案夾内有一個build.js檔案；

resolve:定義了解析子產品路徑時的配置，常用的就是extensions;可以用來指定子產品的字尾，這樣在引入子產品時就不需要寫字尾，全自動執行個體；

plugins:定義了需要使用的插件，比如commonsPlugin在打包多個入口檔案時會提取公用的部分，生成common.js；

module.loaders:是檔案的加載器，比如react需要在頁面中引入jsx的js源碼至頁面上來，然後使用該文法，但是通過webpack打包後就不需要再引入JSXTransformer.js;看到上面的加載器；比如jsx-loader加載器就是代表JSXTransformer.js的，還有style-loader和css-loader加載器；是以在使用之前我們需要通過指令把它引入到項目上來

如果設定好了webpack.config.js之後 ，那麼就可以在指令行裡直播運作webpack指令進行打開；如果配置檔案不是叫webpack.config.js，而是叫其他比如：webpack.dev.config.js，那麼打開裡就要用到--config 來指定配置檔案： webpack --config webpack.dev.config.js