Question

我正在尝试将ES6与webpack一起使用。它可以用于javascript模块的导入/导出，但是我无法让raw-loader工作。

以下是我打算在源文件中执行的操作

import template from './template.html'

template.html文件中包含原始HTML。

module.exports = {
  context: __dirname,
  entry: [
    'babel-polyfill',
    './app/app.js',
  ],
  module: {
    preLoaders: [
      {
        test: /\.js$/,
        include: __dirname + '/app/',
        loader: 'eslint-loader',
      },
    ],
    loaders: [
      {
        test: /\.js$/,
        include: __dirname + '/app/',
        loader: 'babel-loader?presets[]=es2015',
      },
      {
        test: /\.html$/,
        include: __dirname + '/app/',
        loader: 'raw-loader',
      },
    ],
  },
  output: {
    path: './build/',
    filename: 'app.js',
  },
};

当我启动webpack时，代码生成如下：

  module.exports = "module.exports = \"  hello\\n  <div>\\n    <ul>\\n      <li ng-repeat...

它应该只是应导出的"hello\n <div>..."字符串。

对此有何帮助？我真的不明白怎么做。

Answer 1

使用raw-loader导入返回具有默认属性的对象（从'。/ file'导入*作为模板）。您可以将其命名为template.default以获得所需内容。

以下是simmillar issue

在这里，你无法一眼看出update code of raw loader如何使用导入的值。只是暂时修补了一下

ES6进口原装载机

1 个答案: