标签: parceljs

尝试使用 import.meta 时，我不断收到“仅当 '--module' 选项为 'es2020'、'esnext' 或 'system'.ts(1343) 时才允许使用 'import.meta' 元属性” .url（如Parcel 文档中所示）。是的，我已经按照消息中的建议配置了 tsconfig（尝试了所有 3 个选项）。

我正在尝试使用 React、Typescript 和 Parcel 2 从资产文件夹动态加载图像。我在互联网上搜索解决方案，并且阅读了有关 Typescript 中合并和增强类型的内容，但我似乎无法做到这一点工作。

我正在尝试导入图像以在使用TypeScript的React组件中使用.我正在使用的捆绑包是Parcel(不是Webpack).

我.d.ts在项目中创建了一个带有图像文件扩展名的文件,并将其包含在里面tsconfig.json.但是,当我尝试导入图像时,T​​S对我大吼大叫Cannot find module.

我的项目结构:

+ src
  + assets
    - image.jpg
  + components
    - Box.tsx
    - App.tsx
  - index.d.ts
  - index.html
  - index.tsx
- tsconfig.json
- tslint.json

我试着App.tsx像这样导入图像.VS Code强调 '../assets/image.jpg'并说Cannot find module '../assets/image.jpg'.

import * as React from 'react';
import * as img from '../assets/image.jpg';

const Box = props => {
  // do things...
}

export default Box;

我在网上发现的讨论指出需要.d.ts自己定义一个文件,所以我index.d.ts用这一行创建了这个文件.

declare module '*.jpg';

然后加入"include": ["./src/index.d.ts"] …

在开发环境中，我的应用程序运行良好。在生产环境中，它崩溃并显示以下错误：

Uncaught TypeError: (0 , _react.useEffect) is not a function

它发生在我创建的文件中，我在其中导入 React 和 useEffect，如下所示：

import React, { useEffect } from 'react'

const X = () => {
  useEffect(() => { ... })

  ...
}

在此行下方添加一个 console.log 确认 useEffect 在生产中确实未定义，而在 dev 中则是预期的功能。

我检查了我的 package.json、yarn.lock 和 node_modules 是否有任何可能在 16.8.0 下引入 useEffect 的 react 或 react-dom 版本。但一切都是 16.13.1，它们是主要依赖项，我确实尝试清理我的纱线缓存，删除 node_modules 和 yarn.lock，然后重新安装。

我尝试添加和删除它，peerDependencies但没有成功。

我进行了检查以确保没有 2 个独立版本的 React 正在运行，而是保存window.React1 = React在库和window.React2 = React我的应用程序内部并检查

window.React1 === window.React2 这是真的，所以也不是这样。

最后，我还尝试将 React …

我的设置如下所示：Windows 10, Release 1909 (Build 18363.1082)，在 Ubuntu 20.04 环境中使用 WSL2。大多数时候一切都很好，但有些问题我无法解决。

在使用parcel(React bundler) 进行开发期间，我遇到了 bundler 显然同时打开大量文件的问题，并且在某个时候，我遇到了以下问题：

EMFILE: too many open files, open '/home/myusername/Projects/some-project-path/node_modules/@material-ui/icons/esm/RoundedCornerRounded.js'

由于parcel看似不容易支持使用类似的东西graceful-fs，我试图增加在 Ubuntu 环境中打开文件的限制。到目前为止我尝试过的：

• 一个简单的ulimit -n 4096（默认情况下是最高的），但显然（到目前为止？）还不够
• 我尝试增加到fs.files-max非常高的值/etc/sysctl.conf，但它似乎没有效果（无论sysctl -p是在 重启之后还是重启之后wsl）
• 我也尝试增加fs.inotify.max_user_watches，但这似乎也没有效果
• 还设置软硬限制/etc/security/limits.conf似乎没有效果
• 我还发现，信息变更DefaultLimitNOFILE中/etc/systemd/system.conf可以有效果（所以我这样做，以及）

有没有人设法在 WSL2 上的 Ubuntu 20.04 上解决类似的系统？这让我很困惑，它阻止我parcel在这个环境中使用。这真的很遗憾，因为其他一切都运行良好。

更新

所以我发现我在不同地方（可能是/etc/security/limits.conf）的变化产生了某种影响。只是在直接登录时不会。这说明了这一点：

donmartin@SOMEMACHINE:~$ ulimit -Hn
4096
donmartin@SOMEMACHINE:~$ su donmartin
Password: …

我已经能够在Django项目中使用Webpack.现在我想在Django项目中使用Parcel.

问题是如何在Django项目中使用像Webpack这样的Parcel？

我有一个非常简单的项目，设置为使用 Parcel 作为捆绑器。这只是他们的入门指南中的基本示例。

对于单个构建，一切正常，但我注意到对于每个构建，javascript 代码都是在新的哈希下编译的。这可能会导致在目录中创建多个 JS 哈希值dist/。有没有办法清除dist/每次构建之前的所有内容，以便它只包含最新的代码？

在尝试使用“parcel index.js”运行服务器时：

服务器运行在http://localhost:1234 没有找到条目。在 Bundler.bundle (/usr/local/lib/node_modules/parcel-bundler/src/Bundler.js:275:17)

服务器显示 404 错误。我的所有项目都遇到同样的问题，所以我觉得这是一个全球性问题。在所有项目上一切正常，突然发生了这种情况。

已经尝试过：

• 卸载parcel-bundler并重新安装（全局+本地）

谢谢！

我正在做一些测试开发并使用 Svelte 和 ParcelJS 创建一个 Chrome 扩展，并希望在 chrome 开发工具中查看源映射。但是，在查看任何页面时，我只能看到捆绑的代码，看到此错误：

DevTools 无法加载 SourceMap：无法加载 chrome-extension://debafkiakedogoflaalmbbfbbccnfbib/Background/index.js.map 的内容：HTTP 错误：状态代码 404，net::ERR_UNKNOWN_URL_SCHEME

似乎加载程序不喜欢chrome-extensionurl 方案。我已经尝试将“dist”添加为覆盖目录，但是无论加载什么源映射似乎都会忽略它并仍然使用“chrome-extension”方案。

我可以通过手动将 url 更改为另一个模式（file:///url 或在 dist 目录中运行简单的 http 服务器并使用http://url）来使其工作：

//# sourceMappingURL=file:///c:/git/svelte-extension/dist//Background/index.js.map`
//# sourceMappingURL=http://localhost:8080/Background/index.js.map`

有没有办法让chrome覆盖目录或告诉parcel创建这些url？

我有一个动态加载的资源文件的文件夹，我想将其包含在我的包输出目录中。如何像.json, .jpeg, .txt, .etc我的parcel build命令一样包含未引用的静态资源文件？

我有一个具有这种结构的项目：

src
 |- index.pug
 | - layout
 |     |- index.less
 | - scripts
 |     |- index.js

现在，当我运行时parcel build src/index.pug，所有文件都被捆绑在一起，并且我在分发文件夹中找到了它：

dist
  |- index.html
  |- index.12345.css
  |- index.12345.js

当我看到类似的东西时：

dist
  |- index.html
  |- layout
  |    |- index.12345.css
  |- scripts
  |    |- index.12345.js

所以，我的问题是：我可以使用 ParcelJS 为我的 css、js 和图像指定输出路径吗？