JHipster - 无法在 angular.json 中添加 jquery 路径答案

【问题标题】：JHipster - cant add jquery path in angular.jsonJHipster - 无法在 angular.json 中添加 jquery 路径
【发布时间】：2020-01-21 17:54:25
【问题描述】：

通常很容易将SCSS 样式和jQuery 路径添加到角度项目，我们只需将其添加到脚本：[] 部分，

但是：

查看jhipster生成的angular.js，我可以看到架构师部分是空的：

{
    "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
    "version": 1,
    "newProjectRoot": "projects",
    "projects": {
        "consuldent": {
            "root": "",
            "sourceRoot": "src/main/webapp",
            "projectType": "application",
            "architect": {}
        }
    },
</i>

为我的index.html 添加路径对我有用，但我想知道是否有其他方法。

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>

【问题讨论】：

您是否阅读过项目 README.md 中有关传单的示例？添加到 index.html 仅在 dev 中有效，但在 webpack prod build 中无效。
你找到解决这个问题的方法了吗？我有同样的问题，我需要一个解决方案

标签： jquery angular sass compilation jhipster

【解决方案1】：

这里是“如何在jhipster中添加jquery”的解决方案（版本angular）：

 npm install --save --save-exact jquery
 npm install --save-dev --save-exact @types/jquery

在您的vendor.ts（位置：src/main/webapp/app/vendor.ts）中添加：

....
import 'jquery/dist/jquery.js';
import 'jquery/dist/jquery.min.js';
....

然后将其添加到您要使用 jquery 的组件中（只是下一个导入）：

....
import * as $ from 'jquery';
....

在您的 ngOnInit 函数中：

 ngOnInit(): void {
    $(()=>{
      $('#id').codejs....;
    });
  }

【讨论】：