使用 webpack、角度全栈生成器注入 ngMaterial

Question

我想构建一个 Web 应用程序，我已经开始使用 angular fullstack 生成器来构建它。这个生成器使用 webpack，这是我第一次使用 webpack。

我一直在尝试通过以下方式安装 ngMaterial 依赖项：

npm install angular-material --save

我已经在webpack.make.js 文件中的config.entry.vendor 中添加了依赖项，但是当我尝试导入ngMaterial 时收到以下错误：

ERROR in ./client/app/app.js Module not found: Error: Cannot resolve module 'ngMaterial' in path\client\app @ ./client/app/app.js 21:18-39

如何使用 webpack 注入依赖项？

Answer 1

我假设你在 webpack 配置中指出了错误的依赖名称：ngMaterial 而不是 angular-material。

ngMaterial 是 angularjs 模块名称，您将其作为 Angular 应用模块中的依赖项，如下所示：

angular.module('app', ['ngMaterial'])

但是在webpack 依赖中你必须指向node.js 模块名称，即angular-material（通过npm install 命令安装后它位于node_modules 文件夹中）

编辑：

如果您的app.js 需要，您还必须通过import 'angular-material' 或require('angular-material') 导入该模块。但是，如果您将此依赖项包含在单独的 vendor.js 文件中（通过 webpack），那么您不应该将此模块包含在您的 app.js 中，因为它将上传到 vendor.js 中的页面。如果这样做，您将在项目中包含 2 次。