问题标签 [parceljs]

失败的插件是@babel/plugin-transform-regenerator（无边缘插件，160 万次下载/周）。

这是我的全部.babelrc：

当我尝试使用 parcel 对其进行转换时，parcel build source/main/index.html --no-source-maps --out-dir build出现以下错误：

这是我的 package.json 版本：

有任何想法吗？

I've got a basic client-side rendered vue app that fetches a json array from an API endpoint and renders data from each array item as a list item in an ordered list.

The data renders as expected when I'm developing locally, using parcel index.pug to spin up my local dev environment. Here's a screenshot of the expected ordered list as shown in my local dev environment at localhost:1234:

However, the data does not render as expected when I build for production (using parcel build index.pug). Here's a screenshot of the unexpected behavior in production mode (which you can see live online at https://errands.netlify.com/):

Notice that the production version knows the fetched API data is an array with a length of 6 (because it renders out 6 empty <li>s), but for some reason the production version does not know the data inside each array object.

The full source code for this app is here, https://github.com/brianzelip/groceries-vue.

The main relevant code (the axios call to the API, which updates the vuex store, then renders out the ordered list) lives in TheGroceryForm.vue, which is also included here:

Why does the data change when I build my app for production? And how can I change this behavior to get the expected outcome?

我从事一个新项目，但无法正确安装软件包。我用过npm install, yarn, npm install --only=dev, 但不够用。我也尝试删除 node_modules 和 package-lock.json。状态是一样的。

我们在项目中使用的是 babel 的 6.x 版本。Babel 有一个更新，7.x，我想我在运行npm install, npm install --only=dev, yarn.

npm WARN deprecated babel-preset-es2015@6.24.1: � 感谢使用 Babel：我们建议现在使用 babel-preset-env：请阅读 babeljs.io/env 进行更新！npm notice 创建了一个锁文件作为 package-lock.json。你应该提交这个文件。npm WARN babel-loader@8.0.4 需要 @babel/core@^7.0.0 的对等点，但没有安装。您必须自己安装对等依赖项。npm WARN babel-loader@8.0.4 需要 webpack@>=2 的对等点，但没有安装。您必须自己安装对等依赖项。

我使用 WebStorm。在此之前，我尝试使用 npm install 为另一个项目获取包。“Npm”不成功。WebStorm 建议我使用 Yarn，我使用了 Yarn。它奏效了。

我应该在该州做什么？

之后npm install，当我运行时parcel index.html，我得到控制台错误

“未捕获的 TypeError：window.fooes 不是构造函数”，未捕获的 ReferenceError：未定义 regeneratorRuntime。

我知道代码没有问题，因为项目可以在团队的计算机上正确运行。

使用 Parcel.js 构建器从另一个 HTML 文件导入 HTML 文件时，我得到一个神秘的异常：

cannot read property 'walk' of null

这意味着什么？

为什么这个基本 Vue.js 应用程序的 Parcel 生产版本会删除viewBoxSVG 图标上的硬编码属性？在本地开发模式下，viewBox不会删除并且 svg 会正确呈现。

这是带有问题 svg 的生产版本，在 netlify 上直播：https ://errands.netlify.com/ 。

这是生产版本的屏幕截图（缺少每个杂货项目名称左侧的灰色“编辑”图标）：

这是在开发模式下正确渲染的 svg 的屏幕截图（请参阅每个杂货项目名称左侧的灰色“编辑”图标）：

这是作为 Vue 组件的 svg 的源代码：https ://github.com/brianzelip/groceries-vue/blob/master/src/components/Icons/IconEditSolid.vue

这是调用上述 svg 组件的父组件：https ://github.com/brianzelip/groceries-vue/blob/master/src/components/GroceryForm/GroceryFormItemEditLink.vue

为什么生产版本会删除viewBoxsvg 元素的属性？以及如何阻止这种行为？

我一直在尝试在react. 我没用webpack，我在用parceljs。也使用typescript我尝试过：

import image from path/to/image.png <img src={image} />

内部反应组件：

尝试：<img src="path/to/image.png" />

尝试：<img src={"path/to/image.png"} />

不过，还是不行。

代码看起来像这样：

我使用 Webpack 已经有一段时间了，但它对我来说有点过于广泛了。这就是为什么我想从 Parcel 开始，以了解捆绑项目的基础知识。

假设我有一个基本的 index.html 文件，它有一个指向 JavaScript 文件的链接。

在这个 javascript 文件中，我有几个依赖项导入。

它应该看起来有点像这样。

索引.html

和 script.js

现在，当我使用捆绑 index.html 文件时

包裹捆绑 index.html --public-url 。

我想使用 chrome 开发人员工具控制台来控制台（从控制台）一些 javascript，例如myString

但是由于 parcel 将所有内容都捆绑在一个函数中，因此无法访问此变量并且控制台返回：

未捕获的 ReferenceError：未在 :1:1 定义部分

我如何仍然使用 parcel 作为捆绑处理器在控制台内调试我的项目？

我已经使用 parcel bundler 构建了一个应用程序，我正在尝试部署到 heroku，但出现以下错误，相信这是因为 parcel 使用 1234 作为默认端口，heroku 将尝试使用随机端口，有没有办法覆盖这个?

2018-10-21T13:10:13.750160+00:00 heroku[web.1]: Error R10 (Boot timeout) -> Web process failed to bind to $PORT within 60 seconds of launch

如何在 heroku 上部署我的包裹捆绑应用程序？

一直在尝试为我的反应应用程序设置带有包裹的 apollo-client。一切正常，但在控制台中，有很多关于我的 CI 管道中 node_modules/apollo-client 中缺少源文件的警告。

已尝试清除纱线缓存，删除 node_modules 并再次安装。但警告是持久的。我可能遗漏了 parcel 或 babel 配置的一些东西。发现了一些提示，但它们是特定于 webpack 的。

以下是日志：

我正在为 Chrome 创建一个 webextension，以下代码会导致错误：

Chrome 抱怨说：

未捕获的类型错误：jquery_1.default(...).popover 不是函数

看起来引导程序根本不可用。我知道脚本的导入顺序很重要：Chrome 扩展“$ is not defined”错误

所以我确保在我的代码之前包含引导程序：

这些脚本路径是有效的。

编辑：

对不起，我搞砸了这个错误的文档。显然，只有当我使用打包工具（例如包裹）时才会发生这种情况。我只用包裹进行了测试，但我相信任何捆绑管理器都会出现这个问题，例如 webpack 或 browserify。