Vue.js - lodash |如何在全局范围内仅导入特定功能？

Question

我目前像这样导入整个 lodash 库：

import _ from 'lodash';
Object.defineProperty(Vue.prototype, '$_', { value: _ });

它工作正常，我可以使用this.$_.startCase()访问所有lodash函数

但我在整个项目中只使用了startCase 和omit 函数。所以我尝试导入这些函数：

import {startCase, omit} from 'lodash/core';
Object.defineProperty(Vue.prototype, '$omit', { value: omit});
Object.defineProperty(Vue.prototype, '$startCase', { value: omit});

但是当我尝试使用this.$omit() 访问这些函数时，它会抛出一个错误，指出该函数未定义。

这里出了什么问题？

Answer 1

为了使用像import {omit} from 'lodash/core' 这样的命名导入，lodash/core 应该是具有export 声明omit 的ES 模块。 lodash 包是 UMD，这意味着它被 Webpack 视为 CommonJS 模块，并且由于模块互操作性而只有默认导出。

lodash/core 在这方面的工作方式与lodash 相同，整个模块将被导入到包中：

import _ from 'lodash/core';
let { omit } = _;

函数应该从单独的嵌套lodash 模块导入：

import omit from 'lodash/omit';

或者它们应该从提供 ES 模块并允许命名导入的 lodash-es 包中导入：

import {omit} from 'lodash-es';