问题标签 [npm-package]

我正在尝试将资产从 npm 包发送到 nuxt 应用程序。有没有人成功做到这一点？

我有一个 vue 组件作为具有结构的 npm 包：

这个矢量图像被加载到这个 npm 包中的 vue 组件的模板中，如下所示：

在单独测试这个包时，上面的内容可以很好地使用。

但是，当我像这样在 nuxt 应用程序中导入 npm 包时：

当我运行应用程序时，我得到了 svg 的 404。

http://localhost:3000/_nuxt/img/noun-filter.b16c5666.svgNuxt在它不存在的地方寻找文件。

我在这里缺少什么吗？为什么nuxt会改变资产的路径？为什么它不像我们期望的那样只查看节点模块？

如何通过 npm 包将静态资产发送到 nuxt？

我试过的

• 尝试在我的应用程序中使用 url-loader。网址仍然在 nuxt 中被重定向
• import @myname/mypackage/src/assets/noun-filter.svg在 nuxt 应用程序中导入项目
• 将 npm 包中的相对 url 从../assets切换为@assets
• 将 assets 文件夹移动到 npm 包的根目录，并将其添加到 package.json 中包含的文件中

以上所有结果都与 nuxt 在以下位置查找图像的结果相同： http://localhost:3000/_nuxt/img/noun-filter.b16c5666.svg

我尝试将此包导入我的 nuxt 项目。我所有的编码实验都可以在这里找到。我会参考不同的分支。

有几种方法可以做到这一点：

1. 只需在此处的页面中直接导入它（主分支）

这种方法效果很好。您可以通过主页上的按钮进入上传页面。

直到您手动刷新页面

然后你会得到这个错误SyntaxError Cannot use import statement outside a module

当您尝试构建它时会发生相同的错误。

2. 通过插件导入它（比如在插件使用分支中，在构建中有或没有供应商选项）

我有同样的错误。

3. 通过带有一些选项的插件导入它（例如在插件选项分支中）

然后，仅当您刷新页面并且仅在开发模式下才加载包。

如果您将转到主页上的那个按钮（之前引用过） - 将会有一个空白页面。

4. 通过模块导入它（如在模块分支中）。

然后nuxt根本无法加载，出现这个错误SyntaxError: Invalid or unexpected token

您能否评论每种方法以及为什么它不起作用？如何正确导入？

希望你们今天过得愉快。我需要在我的一个应用程序中使用这样的交互式日历

我想知道是否有一个反应库可以帮助我实现这一目标

我尝试使用 npm 包 @datafire/confluence 通过 confluence.content.id.put({ 但在 confluence 页面中出现错误。“我们无法显示您的内容刷新页面，如果问题仍然存在，请重试，联系 Atlasian 支持”。为什么 confluence 页面会显示这个错误？

这是代码

这可能是一个愚蠢的问题，但我真的不知道发生了什么。

我已经创建了一个 React 应用程序crate react app并将其作为私有存储库上传到我的GitLab帐户。（默认）React App 在yarn start本地运行后按预期启动localhost:3000。由于我需要为持续的代码开发创建包，因此我开始在 GitLab 使用NPM 注册表。这实际上很容易：

1. .npmrc在 app 目录中创建一个
2. 像这样添加范围、存储库 ID和身份验证令牌（我选择使用个人令牌）

3. 运行npm init以初始化包
4. 将范围和publishConfig添加到package.json类似的位置

5. 跑npm publish

就像我说的那样，包被上传到我的 GitLab 帐户，范围很好。我现在唯一的问题是yarn start从我的本地仓库运行确实会导致空白屏幕。我也意识到 yarn 不再重定向到http://localhost:3000，而是重定向到http://localhost:3000/scope/repository-name.

我在这里想念什么？

谢谢！

我们正在尝试创建一个 Vue npm 包，其中一个组件导入另一个组件（一个简单的示例可能是 - 该包包含一个通用按钮组件和一个使用我的按钮组件进行分页的表格组件）。我可以将子组件导入父组件并成功构建包。但是当我在应用程序中导入和使用父组件（从包中）时，子组件内容不显示。跳过它，就像它不存在一样。

我很茫然。

我正在使用一些非常简单的组件进行测试：

（编辑）这是我的 index.js 文件

用法（在不同的应用程序中，在“添加纱线......”之后）

这就是我在页面上得到的：

以下是我知道的一些事情：

• ParentComponent 到 ChildComponent 的导入路径是正确的。如果我故意将路径更改为不存在的内容，则在尝试构建时会出错。
• 如果我直接在应用程序中导入和使用 ChildElement，它会按预期工作。
• 如果我将 ParentComponent 和 ChildComponent 复制到应用程序结构中，然后以这种方式导入它们（而不是从包中导入它们），那么 ParentComponent 就会完全按照我期望的方式显示 ChildComponent。

我看到其他似乎以这种方式导入组件的包，所以我认为我正在做的事情是可能的。

我将不胜感激任何人的任何想法！

（如果我包含项目中的更多代码，请告诉我是否有帮助）

更新我已经对此进行了更多跟踪。当我包含子组件时，我从应用程序收到此警告：

[Vue 警告]：resolveComponent 只能在 render() 或 setup() 中使用。

这帮助我在互联网上找到了其他资源，但没有任何帮助。我的简单测试没有在任何地方明确使用 resolveComponent。如果我确实使用它和渲染函数而不是模板，同样的结果，同样的警告。

我正在寻找 Node.js 的 RTF 到 PDF 转换器。我在 npm 站点上没有找到太多的包。

该应用程序如下：我需要从 AWS S3 存储桶中提取一个 RTF 文档（在 Word 中创建并保存为 .rtf）。然后我需要将文件作为 RTF 字符串读取。接下来，我需要将 RTF 字符串中的某些占位符标记替换为值（例如，在“{host-name} 想邀请您在 {date} 到 {address}。”--我需要替换 {host-name }、{address} 和 {date} 的实际值）。然后，插入实际值后，我需要将字符串转换为可以附加到电子邮件的 PDF。

出于这个原因，我不能使用任何几个 Word-to-PDF 包中的任何一个（因为我需要干预用值插入占位符的中间步骤），所以我正在寻找一个 RTF-to-PDF 转换（RTF 以字符串开头）。

有这样的事吗？

谢谢。

我有一个来自我的包所依赖的 C 库的 .exe 文件。当用户的 PATH 中已经包含此命令时，我的包可以正常工作。但是当用户安装我的包时，有什么方法，NPM 也从这个 C 库安装这个命令？我试图在 package.json 的 bin 中包含 .exe 文件，当全局安装我的包时，此命令可用于提示。但不适用于 child_process.spawn。当我的代码尝试使用它时，我收到一个错误：

// 编辑

基本上我需要在我的包安装时设置一个 PATH 变量，因此命令“fpcalc”将可用于 child_process

我试图在按钮点击反应后保留电话号码。

这里使用的包是 npm react-phone-input-2

输入电话号码后，我点击下一步进入密码页面。

进入密码页面后，我将单击返回按钮，该按钮重定向到电话号码输入页面。

但是返回电话号码页面后，输入的值不会被保留。

我们已经制作了自己的 npm-package，我现在正在处理超时警报。为了让时间正常工作，我需要将它放在 useEffect 中，但出现错误：react.development.js:1465 Uncaught Error: Invalid hook call。.

npm 包中组件中的文件在 typescript 中，但我认为这不是问题所在。.tsx：

索引.ds

如果我删除 useEffect，它可以工作，但超时不会正常工作。当我使用包时，我会在我的 jsx 文件或 tsx 文件中导入我不想使用的组件。我已经制作了十个左右的组件，但除了这个之外，我没有在其中任何一个中使用过钩子。

我在哪里使用组件 App.jsx：

我在导入这个 npm 包的主要项目中使用反应钩子，所以我通常知道问题出在哪里，但我不知道它现在不起作用的方式。我通常不使用打字稿，它只是在 npm 包中使用它来获得智能感知，但我仍然认为它的反应就是问题所在。但我可能是错的。

编辑：

这是导致错误的 useEffect ， useState 抛出相同的错误（试图使用它来更改警报类）。

我在多个项目中使用过这种超时，这就是为什么我想要在我们的 react-components npm-package 中使用它。

控制台中的完整错误消息：

未捕获的错误：无效的挂钩调用。钩子只能在函数组件的主体内部调用。这可能由于以下原因之一而发生：

1. 你可能有不匹配的 React 版本和渲染器（例如 React DOM）
2. 您可能违反了 Hooks 规则
3. 您可能在同一个应用程序中拥有多个 React 副本，
   请参阅 ... 了解有关如何调试和修复此问题的提示。

在 resolveDispatcher (react.development.js:1465)
在 Object.useEffect (react.development.js:1508)
在 TimeOutAlert (TimeOutAlert.js:14)
在 renderWithHooks (react-dom.development.js:14803)
在 mountIndeterminateComponent (react -dom.development.js:17482)
在 beginWork (react-dom.development.js:18596)
在 HTMLUnknownElement.callCallback (react-dom.development.js:188)
在 Object.invokeGuardedCallbackDev (react-dom.development.js: 237)在 beginWork$1 (react-dom.development.js:23203)
的 invokeGuardedCallback (react-dom.development.js:292 )