Question

我有一个完整的传统AngularJS 1.x应用程序，曾经用于通过gulp和babel。我们正在转向更新的Angular 2+，但我遇到了一个问题，试图让Webpack真正找到并编译遗留文件。我已尝试按照与此视频完全相同的说明操作：

https://www.youtube.com/watch?v=H_QACBSqRBE

但是webpack配置根本不对现有文件做任何事情。有没有办法抓住旧组件的整个文件夹，没有任何进口或出口？我觉得入口应该遵循导入依赖路径，但是对于旧的AngularJS 1.x项目来说，它不存在。

错误不会在构建过程中被抛出......它不会转换或填充。

配置的该部分的示例：

rules: [
  {
    test: /\.js$/,
    exclude: /(node_modules|bower_components)/,
    use: {
      loader: 'babel-loader',
      options: {
        presets: ['@babel/preset-env']
      }
    }
  }
]

Answer 1

我们最近这样做了。我们创建了＆＃34; dummy＆＃34;入口点文件，以避免必须将所有AngularJS文件更改为require / import语句。

<强> ./入口点/ feature1.ts

export const importAll = (r: any): void => {
  r.keys().forEach(r);
};
importAll(require.context('./app/feature1', true, /module\.js$/));
importAll(require.context('./app/feature1', true, /(^(?!.*(spec|module)\.js).*\.js)$/));

<强> webpack.config.js

entry: {
  'feature1': './entry-points/feature1.ts'
}

More detail here

设置Webpack和Babel来转换/填充旧代码

1 个答案: