2

我正在尝试从 Material.io 集成 material-components-web。但事实证明这很麻烦。我对 Node 世界也很陌生，所以我一直在学习。

这是我到目前为止所做的：

  1. 将 NPM 与 Visual Studio 2017 相结合，我可以使用很多功能，但它并没有像我想象的那样工作。例如 Npm init 挂起，但安装/更新命令工作正常。

  2. 获得了具有以下依赖项的 Packag.json：

    "devDependencies": { "material-components-web": "0.44.1", "gulp": "3.9.1", "gulp-util": "3.0.8", "gulp-minify-css": "1.2.4", "gulp-path": "4.0.0", "gulp-js-minify": "0.0.3", "gulp-sass": "3.1.0", "gulp-flatten": "0.4.0" }

  3. 安装 Gulp 并设置我的 Sass 编译器和 css/js minifier（用于生产）。并在我构建项目之前将它们设置为运行

我有我的@material 文件夹，其中包含所有基本组件。但是现在我遇到了 Javascript 模块依赖的问题。

我注意到标准的“要求”方法不起作用，因为它是一个特定于节点的解析器（如果我错了，请纠正我）。首先，我尝试将 Babel 集成到 gulp 中以将导入转换为 ECMA。但这似乎并不成功。

现在我正在手动转换所有的导入/导出（所以更新是不行的）。它开始工作得很好。但是现在我陷入了依赖地狱中，到处都是引用和导入......来自像（focus-trap.js，tabbale和xtend）这样的依赖项

这甚至可以集成到 ASP.NET MVC 中吗？我还注意到 Material-components-web 开始在他们的 github 上切换到 TypeScript！

非常感谢任何提示或帮助。

4

1 回答 1

4

我最终执行了以下操作，以便能够将 material-components-web 用于前端：

  1. 下载 Node.Js 并将 NPM 位置添加为 Visual Studio 2017 的第 3 方引用。
  2. 将 node_modules 文件夹添加到我的项目并运行 npm-install
  3. 复制所有依赖项（除了“Babel”转译器）。并使用 NPM 安装它们
  4. 为编译、提取等创建了一个 WebPack 配置。

它实际上是非常基础的，但是在没有任何知识和信息的情况下，在旧的 MVC 项目中使用这种类型的 NPM 包是一个很大的麻烦。

如果有人需要更多信息或帮助，请在下面发表评论。

于 2019-04-22T15:29:18.223 回答