2017-08-02 209 views
2

我有一個YAML文件,有幾個翻譯。我需要將這些文件轉換爲JSON文件。我試過使用yaml-import-loaderjson-loader,但我得到一個錯誤。Webpack - Yaml - > JSON - >提取文件

這裏是我的設置:

const ExtractTextPlugin = require('extract-text-webpack-plugin'); 

const extractEnglish = new ExtractTextPlugin('lang/en.js'); 

module.exports = { 
    entry: [ 
    './src/locales/application.en.yml', 
    ], 
    output: { 
    filename: 'english.js', 
    }, 
    module: { 
    strictExportPresence: true, 
    rules: [ 
     { 
     test: /\.en\.yml$/, 
     use: extractEnglish.extract({ 
      use: [ 
      // { loader: 'json-loader' }, 
      { 
       loader: 'yaml-import-loader', 
       options: { 
       output: 'json', 
       }, 
      }], 
     }), 
     }, 
    ], 
    }, 
    plugins: [ 
    extractEnglish, 
    ], 
}; 

而我得到的錯誤:

Users/xxx/Documents/Project/node_modules/extract-text-webpack-plugin/dist/index.js:188 
      chunk.sortModules(); 
       ^

TypeError: chunk.sortModules is not a function 
    at /Users/xxx/Documents/Project/node_modules/extract-text-webpack-plugin/dist/index.js:188:19 

同樣的錯誤了json-loader是否被評論或沒有。

我真的不明白髮生了什麼問題。

版本: 「的WebPack」: 「2.6.1」, 「提取文本-的WebPack-插件」: 「^ 3.0.0」, 「JSON-裝載機」: 「^ 0.5.7」,

+0

對不起,也許是錯誤的措辭。我在YAML中有文件...我用於翻譯。這意味着在那裏我有鍵/值,其中鍵是標識符,而值是實際的翻譯。所有文件('.en.yml','.es.yml' ...)都具有相同的密鑰,但具有不同的值。 –

+0

您的錯誤出現在您未顯示的一行代碼中。看起來這行代碼是'extract-text-webpack-plugin'的一部分。所以你似乎在你使用的模塊中出現了錯誤,應該把它報告爲一個錯誤。除非插件開發者之一出現,否則你不可能在這裏獲得幫助。 – flyx

回答

3

不知道這是否會幫助你的情況,但我最近找到了解決我的i18n加載問題。我這樣做是爲了將YAML提取到JSON文件中,因爲我使用angular-translate並需要動態和按需加載文件。我避免了extract-text-webpack-plugin並僅使用加載器:file-loader和yaml-loader。

首先,我建立了我近源代碼的開始.yaml文件的導入(在我的情況的進口文件的WebPack來處理特定鏈)

import "./i18n/en.user.yaml"; 

我更新的WebPack配置到YAML轉換成JSON並將其提供給動態加載(一切從我的「src」目錄起源,因此上下文):

rules: [{ 
    test: /.\.yaml$/, 
    use: [{ 
    loader: 'file-loader', 
    options: { 
     name: '[path][name].json', 
     context: 'src' 
     } 
    },{ 
     loader: 'yaml-loader' 
    }] 
    }] 

這將轉化我的YAML文件(S),並在導出到我的公開目錄,在這種情況下, '/i18n/en.user.json'。

現在,當angular-translate通過$ http on-demand上傳我配置的i18n設置時,它已經具有解析的YAML,並避免必須在前端使用js-yaml(或類似的)解析它。

相關問題