1.报错背景:安装依赖引入使用时报错
当我在angular项目中npm i split.js (分割视图布局的轻量级工具,会有一篇单独的文章讲述这个的使用)依赖 成功之后,然后在我需要使用的模块中.ts文件中进行引入,起初的引入是这样的 import * as Split from 'split.js',就此运行项目,控制台一直报错,Split_WEBPACK_IMPORTED_MODULE is not a function
2.解决方法:改变的引入的层级
尝试过卸载依赖重新安装,或者改换安装的命令,比如使用npm i split.js --force, npm i split.js --save等无果。
尝试过优化优化引入,将import * as Split from 'split.js' 换成 import * as Split_ from 'split.js', const Split = Split_, 这样报错没有了,但是插件却没有起作用
最终得到博主的Angular 引入第三方js库_51CTO博客_vue引入第三方js库这篇文章的启发,找到了真正的解决办法:
改变的引入的层级,多加一级,完全奏效!比如import * as Split from 'split.js' 换成 import * as Split from 'split.js/dist/split.js', (注意多加的一级不能是index.d.ts,也不能只加到dist层级,不然会报错!!!)