webpack - 排除 app.html~ 和 #app.html 等文件

Question

当我在 Aurelia 的 skeleton-navigation/skeleton-typescript-webpack 中编辑 src/app.html 时，webpack 失败并出现以下错误。

WARNING in ./src/app.html~
Module parse failed: /Users/foo/skeleton-test/src/app.html~ Unexpected token (1:0)
You may need an appropriate loader to handle this file type.

如何排除 Emacs 生成的 app.html~ 和 #app.html 等文件作为备份？

我在 webpack.config.ts 中添加了 plugins: 条目, 但它没有用。

...
import * as webpack from 'webpack';
...

let config = generateConfig(
  {
    entry: {
      'app': ['./src/main' /* this is filled by the aurelia-webpack-plugin */],
      'aurelia-bootstrap': coreBundles.bootstrap,
      'aurelia': coreBundles.aurelia.filter(pkg => coreBundles.bootstrap.indexOf(pkg) === -1)
    },
    output: {
      path: outDir,
    },
    plugins: [
       new webpack.LoaderOptionsPlugin({
         options: {
            exclude: [ /.*~$/, /.*#.*/ ],
         }
       })
     ]
  },

Answer 1

Webpack 仅包含应用中实际使用的文件。通常你有一个入口点来导入所有需要的东西，实际上只有那些文件和它们的依赖被包含，其他的都被忽略。不幸的是，aurelia-webpack-plugin 决定将所有内容包含在您的 src/ 目录中作为条目的一部分，坦率地说，这不是一个好主意。 aurelia-webpack-plugin 似乎没有排除某些文件的选项。从GitHub问题来看Add a switch to disable filling the app context with all files from src #72 , 计划了这样的功能，但似乎尚未实现。

无论如何，你不能告诉 webpack 排除你明确需要的东西(在这种情况下是你正在使用的插件，而不是你自己)，只是如何处理它。你尝试将它们从加载器中排除会使事情变得更糟，因为这只是意味着这些文件不应该由加载器处理，而只是按原样包含，这是行不通的，因为它不是有效的 JavaScript。

谢天谢地，您要排除的那些文件与您的编辑器相关，最简单的解决方案是将其配置为将这些备份文件存储在其他地方而不是当前目录，无论如何大多数人都喜欢这样做。具体对于 Emacs，您可以查看 How do I control how Emacs makes backup files? .