javascript - Font Awesome 5 中的 dom.i2svg() 不工作

Question

我正在尝试使用这个 method 创建我们在我们的一个网站上使用的 Font Awesome 图标的子集。让它工作。

虽然 bundle 的大小减小了，但 Font Awesome 脚本似乎正在减慢网站速度。我认为这是由于 dom.watch() 函数观察页面的变化。不会发生任何变化和很多 DOM Node ，所以真的，我只想在页面加载后设置图标。

https://fontawesome.com/how-to-use/with-the-api/methods/dom-watch

https://fontawesome.com/how-to-use/with-the-api/methods/dom-i2svg

根据文档，我假设我可以调用 dom.i2svg() 但这会导致浏览器出现错误:“dom.i2svg() 未定义”。

当我使用 dom.watch() 时显示图标，当我使用 console.log(dom) 时，它显示对象中有 i2svg() 和 watch() 函数，所以我不明白为什么 i2svg( ) 未定义。

我正在使用 rollup.js 来创建包，并且还使用了 parcel-bundler 来获得相同的结果。

这是我正在捆绑的 main.js 文件。

import { dom, library, config } from '@fortawesome/fontawesome-svg-core'

import { 
        faCamera,
        faStar,
        faStarHalf,
        faSearch,
        faExternalLinkAlt,
        faAngleRight,
        faAngleDown,
        faPlay,
        faPhone,
        faExternalLinkSquareAlt,
        faAngleUp,
        faCommentAlt        
       } from '@fortawesome/free-solid-svg-icons'

import { 
         faTwitter,
         faYoutube,
         faInstagram,
         faLinkedinIn,
         faFacebookF 
        } from '@fortawesome/free-brands-svg-icons'

import { faChevronCircleDown as falChevronCircleDown,
         faEnvelopeOpenText as falEnvelopeOpenText,
         faMapMarkerAlt as falMapMarkerAlt,
         faPhone as falPhone,
         faCommentAltLines as falCommentAltLines,
         faExternalLink as falExternalLink,
         faExternalLinkAlt as falExternalLinkAlt,
         faExternalLinkSquare as falExternalLinkSquare,
         faExternalLinkSquareAlt as falExternalLinkSquareAlt,
         faHomeAlt as falHomeAlt,
         faCalendarCheck as falCalendarCheck,
         faFileDownload as falFileDownload,
         faFolderOpen as falFolderOpen
        } from '@fortawesome/pro-light-svg-icons'

import { faCommentAltLines as farCommentAltLines } from '@fortawesome/pro-regular-svg-icons';


library.add(faPhone,                    
            faCamera,
            faStar,
            faStarHalf,
            faSearch,
            faAngleRight,
            faAngleDown,
            faPlay,
            faExternalLinkAlt,
            faExternalLinkSquareAlt,
            faAngleUp,
            faTwitter,
            faYoutube,
            faInstagram,
            faFacebookF,
            faLinkedinIn,
            falChevronCircleDown,
            falEnvelopeOpenText,
            falMapMarkerAlt,
            falPhone,
            falExternalLinkSquareAlt,
            falExternalLinkSquare,
            falExternalLinkAlt,
            falExternalLink,
            farCommentAltLines,
            falCommentAltLines,
            falHomeAlt,
            falCalendarCheck,
            falFileDownload,
            falFolderOpen
            );  

// dom.watch();

dom.i2svg()

如果我使用 dom.watch，<i class="fas fa-camera"></i>按预期替换为 SVG，但如果我调用 dom.i2svg，我会收到一个错误，指出函数未定义。

几天来我一直在努力解决这个问题，也向 FA 寻求帮助，但没有成功。任何帮助将不胜感激。基本上我想使用 dom.i2svg() 因为我猜它会阻止页面变慢。谢谢。

Answer 1

命令不应该是:

 FontAwesome.dom.i2svg()

查看更多详细信息:https://fontawesome.com/v5.0.13/how-to-use/with-the-api/methods/dom-i2svg
这将解释:https://fontawesome.com/how-to-use/with-the-api/methods/dom-watch为什么 dom.watch() 有效，但 dom.i2svg() 无效