[英]add javascript libary with jquery dependency to angular 9
I want to use watermark.js
in my angular app to add watermarks to images before uploading them.我想在我的 angular 应用程序中使用
watermark.js
在上传图像之前为图像添加水印。
from what i remember, what I did should suffice to make this work:根据我的记忆,我所做的应该足以使这项工作:
download下载
npm i --save watermark.js
add to scripts
tag in angular.json
添加到
angular.json
scripts
标签
"scripts":[
"./node_modules/jquery/dist/jquery.min.js",
"./node_modules/watermark/dist/jquery.watermark.min.js"
],
use it in a Component在组件中使用它
declare var watermark: any;
...
watermark(args)
but i get但我明白了
ERROR ReferenceError: watermark is not defined
I also tried to declare it as a module by creating src/@types/watermark/index.d.ts
and including src/@types
it in tsconfig->typeRoots
.我还尝试通过创建
src/@types/watermark/index.d.ts
并将src/@types
包含在tsconfig->typeRoots
来将其声明为模块。
declare module 'watermark'
and then importing然后导入
import * as w from 'watermark';
But with this the build fails because it cannot find the module 'watermark'.但是这样构建失败,因为它找不到模块“水印”。
doing the same with jquery works对 jquery 做同样的事情
import * as $ from 'jquery';
...
$(window).ready(console.log('test'))
any ideas?有任何想法吗?
According to watermark page: https://lelinhtinh.github.io/watermark/根据水印页面: https : //lelinhtinh.github.io/watermark/
$(function() {
$('.img_awesome').watermark();
});
so in your component get a handle on a dom element with jQuery then:因此,在您的组件中使用 jQuery 获取 dom 元素的句柄,然后:
$(<selector>).watermark();
for this you need to: declare var $:any;
为此,您需要:
declare var $:any;
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.