- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
如果安装官方npm package , 它有效。
但是根据official documentation并简单地将 import { Viewer } from "forge-dataviz-iot-react-components"
(如 this 示例)包含在一个空的新 React 项目中(使用 npx create-react- app) 你会得到这个错误:
./node_modules/forge-dataviz-iot-react-components/client/components/BasicTree.jsx 107:16
Module parse failed: Unexpected token (107:16)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| if (node.children.length > 0) {
| return (
> <TreeItem
| id={`tree-node-${node.id}`}
| key={node.id}
我需要在 webpack 上添加哪个 loader 才能避免这个错误?
最佳答案
无法包含包 https://www.npmjs.com/package/forge-dataviz-iot-react-components在使用 npx create-react-app 制作的 React 项目中(希望 Autodesk 能尽快解决这个问题)。
您需要分两部分编辑 /node_modules/react-scripts/config/webpack.config.js
:
一行关于PIXI
...
alias: {
'PIXI': "pixi.js/",
// Support React Native Web
// https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/
'react-native': 'react-native-web',
// Allows for better profiling with ReactDevTools
...(isEnvProductionProfile && {
'react-dom$': 'react-dom/profiling',
'scheduler/tracing': 'scheduler/tracing-profiling',
}),
...(modules.webpackAliases || {}),
},
...
还有关于/forge-dataviz-iot-react-component
的另一部分
...
module: {
strictExportPresence: true,
rules: [
// Disable require.ensure as it's not a standard language feature.
{ parser: { requireEnsure: false } },
{
// "oneOf" will traverse all following loaders until one will
// match the requirements. When no loader matches it will fall
// back to the "file" loader at the end of the loader list.
oneOf: [
{
test: /forge-dataviz-iot-react-component.*.jsx?$/,
use: [
{
loader: require.resolve('babel-loader'),
options: {
presets: ["@babel/react", ["@babel/env", { "targets": "defaults" }]],
plugins: ["@babel/plugin-transform-spread"]
}
},
],
exclude: path.resolve(__dirname, "node_modules", "forge-dataviz-iot-react-components", "node_modules"),
},
// TODO: Merge this config once `image/avif` is in the mime-db
// https://github.com/jshttp/mime-db
{
test: [/\.avif$/],
loader: require.resolve('url-loader'),
options: {
limit: imageInlineSizeLimit,
mimetype: 'image/avif',
name: 'static/media/[name].[hash:8].[ext]',
},
},
...
在那之后 /node_modules/forge-dataviz-iot-react-components/client/components/Viewer.jsx
你会得到关于未定义的 Autodesk 变量的错误 easily fixable changing Autodesk
与 window.Autodesk
。
虽然您不会看到任何其他错误,但该包将无法运行。
关于reactjs - 空项目中 forge-dataviz-iot-react-components 的 Autodesk React Forge 问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/69033665/
请引用这个例子: http://jsfiddle.net/mcLEb/ jQuery("#grid").kendoChart( { theme: jQuery(document
我正在使用 Kendo 制作图表,但遇到了问题。 我正在获取大量数据并将其传递到图表中,数据具有日期和值,我的 js 如下所示: chart.kendoChart({
如何设置剑道 Ui 图表的背景图像? 最佳答案 基本上,您需要将该背景样式应用于初始化图表的元素。 例如 喜欢在这个网上demo . 关于charts - 如何为 Kendo DataViz 图表设
tl;dr:当我将 xAxis 最小值和最大值设置为 2013-01-01 14:30:00 和 2013-01 时-01 15:45,我需要在 xAxis 上查看这些时间,而不是 14:00 和 1
是否可以在kendoUI折线图上添加新数据点和删除数据点而不刷新图表?数据每 5 秒出现一次,图表上最多可包含 720 个数据点(图表将显示过去一小时的数据)。如果图表上有 720 个数据点,则应将下
我有饼图,我希望当我点击按钮时它会显示条形图。可以吗? 最佳答案 是的,这是可能的,只要这样做: // Get reference to your chart var chart = $("#char
我已经使用剑道图表来显示数据,但现在我想读取我之前用来设置数据源的 json。不幸的是我无法让它工作,任何人都可以帮助我,如何从 kendochart 读取数据(json)。 我使用了这个 $("#O
我使用 KendoUI Dataviz 的时间很短,并且发现我几乎可以以任何方式自定义它来满足我的需求,除了一个。我有两张不同的图表,其中某些系列恰好有多个点具有相同的图。 (动态数据)我无法看到所有
我尝试在折线图中的 Y 轴上设置自定义标签,但没有成功。我在论坛搜索谷歌上查看了很多,但没有成功。我最接近的解决方案是隐藏实际标签并使用 valueAxis.notes 代替。我在注释中面临的问题是,
我熟悉 kendoTooltip 插件,并且使用过许多其他控件,但配置该插件的典型方法似乎不起作用。 使用迷你图时,默认情况下工具提示显示在光标右侧。不幸的是,正如您在此图中看到的,这使得迷你图的任何
我一直在关注在线示例(在 https://github.com/keen/keen-dataviz.js/ ),并且使用这个 eager-dataviz CDN 库成功生成了 Dataviz 饼图:
我有以下 JSFiddle:http://jsfiddle.net/rodneyhickman/NYh2b/1/我正在尝试将其设置为测试一些 Kendo UI DataViz 图表。 我收到以下脚本错
我正在尝试使用 Kendo UI Angular 指令在本地绑定(bind) DataViz 饼图,但不断收到此错误: TypeError: Cannot call method 'toLowerCa
尝试设计子弹图,使其完全符合营销部门的要求。所需的图表如下所示: 如何在栏的顶部添加标签? 我尝试从 Kendo 文档设置标签属性: labels: { visible: true, format
我想实现一个kendo DataViz图表,即使用Angular绑定(bind)本地条形图,我还想显示不同颜色的条形图,如图所示: 请告诉我如何实现。 此处创建了一个示例 http://plnkr.c
我正在使用 Durandal 构建一个应用程序以与 PhoneGap 捆绑在一起。当我尝试运行 weyland 优化器时,我遇到了一些问题。构建和优化运行良好,没有任何错误(我使用 requirejs
我使用的是 Kendo UI dataviz 条形图的默认示例。当我放大页面时,图表开始与页面上的其他元素重叠。有没有办法确保包含图形的 div 中的所有内容都不会重叠到其他 div 上。这是一个大问
尝试在绘制折线图之前进行一些自定义数据更改 Keen.io Dataviz 绘制图形但不断收到错误“未捕获请求的解析器不存在” Keen.Dataviz 是否只从 Keen.query 获取数据?
我有一个 Android 应用程序,除其他外,它还可以下载文档。我想提供使用其他应用程序打开这些文档的功能,例如 DataViz 的 Documents To Go 查看器应用程序。我查看了相当多的代
如果安装官方npm package , 它有效。 但是根据official documentation并简单地将 import { Viewer } from "forge-dataviz-iot-r
我是一名优秀的程序员,十分优秀!