jquery - 如何在Webpack Angular 2中包含jQuery和Semantic-ui

我是Webpack的新手，并将其用于Angular2项目(https://angularclass.github.io/angular2-webpack-starter/)。

在npm install编码后，让jQuery和Semantic-ui(.css和.js)都很难工作。我想这有点问题，因为这两个库都不是任何模块格式，不能简单地用require(...)或import ed

我是否需要像往常一样简单地将它们包括在index.html中，还是有一种“Webpack方法”来做到这一点？

最佳答案

按着这些次序:

使用npm安装Semantic-UI:npm install semantic-ui --save并在安装过程中按照说明进行操作。
我将其安装在src/assets下。

使用其目录内的gulp build来“构建”语义。
这将在/semantic下创建另一个名为dist的目录，或在安装过程中设置为输出目录的任何名称。

现在，我们必须告诉Webpack加载Semantic的.js和.css文件(新创建的/semantic/dist/目录中的文件)。
我使用angular-cli生成了我的项目，并将我的配置保存在名为angular-cli.json的文件的根目录中。
看起来像这样:
https://gist.github.com/olegkorol/d77951e3ba3a5ff2c798e96c807c1a02
在JSON中查找“样式”和“脚本”，然后分别添加Semantic的缩小的.css和.js:"assets/semantic/dist/semantic.min.css"和"assets/semantic/dist/semantic.min.js"

正如您在问题中已经提到的那样，Semantic-UI需要jQuery才能正常工作。我们只将脚本添加到index.html的(在/src目录中):<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

再次构建或提供服务，您应该让Semantic-UI正常工作;)

希望这可以帮助。

关于jquery - 如何在Webpack Angular 2中包含jQuery和Semantic-ui，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/35779588/