編寫webpack插件，上傳私服npm

  之前項目中國際化語言由前端研發寫在本地文件，運用iview插件實現國際化語言。參考這篇文章iview實現國際化。現在要求將這些國際文案通過接口獲取，並在打包時生成所有語言本地文件。因此採用webpack和node來創建生成本地文件。

  一、創建插件項目和插件文件i18n.js

const path = require('path')
const fs = require("fs");

const axios = require("axios")

// 參考文檔：https://www.webpackjs.com/contribute/writing-a-plugin/
function CreateI18nPlugin(options) {
  // 使用options 設置插件實例參數
  this.options = options
}

CreateI18nPlugin.prototype.apply = function(compiler) {

  let systemName = this.options.systemName
  let env = this.options.env
  // 即將準備生成文件鉤子事件
  compiler.plugin("emit", function(compilation, callback) { 
    axios({
      baseURL: 'baseUrl',
      method: "post",
      url: "url",
      data: {}
    })   
    .then(function(resp) {
      
      if(resp.status === 200) {
        // 國際文案，根據後臺返回的數據進行處理
        let langAllData = resp.data.data

        // 生成文件
          compilation.assets['enUS.json'] = {
            source: function() {
              return JSON.stringify(langAllData)
            },
            size: function() {
             return Object.keys(langAllData).length
            }
          }
          // json換行美化
          let str = JSON.stringify(langAllData, null, "\t")
          const tmpFile = path.join('src/lang/enUS.json');
          // 創建本地文件
          fs.writeFileSync(tmpFile, str,  function(err) {
            if (err) {
              return console.error(err)
            }
          })
        callback()
      } else {
        callback(new Error('[i18n-plugin] Unable to load the i18n file'))
      }
    }).catch(function(err) {
      callback(new Error(err))
    })
  })
}
// 導出插件
module.exports = CreateI18nPlugin

  二、package.json文件配置，發佈

1) package.json配置說明

name："i18n-plugin" 組件庫名稱，在npm組件中確保名稱唯一，否則不能註冊成功

version："1.0.1"  版本

description："i18n"  組件庫描述

main： "./src/index.js"  入口文件，編譯後的包文件

keyword："i18n"  關鍵字 用戶可以根據關鍵字搜索出組件庫

private： false  是否私有，爲false才能發佈到npm

license："MIT"  開源協議，可以爲MIT

"publishConfig": {

    "registry": "http://*****/repository/npm-hosted/"  // 私服地址

  }

2）npm切換到私服源

npm config set registry http://*****/repository/npm-hosted/

3）登錄私服

npm login --registry=http://*****/repository/npm-hosted/

4) 發佈到私服

因爲在package.json文件已經配置publishConfig，直接npm publish即可。若沒有配置publishConfig，則發佈命令爲

npm publish --registry=http://*****/repository/npm-hosted/

 三、下載私服插件

npm install [email protected] --registry=http://*****/repository/npm-hosted/