Webpack-Yaml-> JSON->提取文件

Question

我有一个带有一些翻译的YAML文件。我需要将这些文件转换为JSON文件。我尝试使用yaml-import-loader，json-loader但出现错误。

这是我的设置：

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”，“ extract-text-webpack-plugin”：“ ^ 3.0.0”，“ json-loader”：“ ^ 0.5.7”，

Answer 1

不知道这是否可以帮助您解决问题，但是最近我找到了解决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文件并将其导出到我的公共目录，在本例中为“ /i18n/en.user.json”。

现在，当angular-translate通过$ http按需上传我配置的i18n设置时，它已经具有解析后的YAML，并且避免了在前端使用js-yaml（或类似方法）对其进行解析。