0

当我尝试在 clojurescript 项目中初始化 Framework7 和 Framework7-React 时，使用 shadow-cljs 出现如下错误：

f7.js:31 Uncaught TypeError: Framework7 is not a constructor
   at Object.init (f7.js:31)
   at F7App.value (app.js:162)
   at commitLayoutEffects (react-dom.development.js:21965)
   at HTMLUnknownElement.callCallback (react-dom.development.js:363)
   at Object.invokeGuardedCallbackImpl (react-dom.development.js:412)
   at invokeGuardedCallback (react-dom.development.js:467)
   at commitRootImpl (react-dom.development.js:25025)
   at exports.unstable_runWithPriority (scheduler.development.js:816)
   at runWithPriority$2 (react-dom.development.js:12189)
   at commitRoot (react-dom.development.js:24866)

Framework7 初始化通常只包含以下内容

// Import Framework7
import Framework7 from 'framework7/framework7-lite.esm.bundle.js';

// Import Framework7-React Plugin
import Framework7React from 'framework7-react';

// Import Framework7 Styles
import 'framework7/css/framework7.bundle.css';

// Init F7 React Plugin
Framework7.use(Framework7React);

有一个 hacky 解决方案，它涉及两个单独的构建管道，以便在一个简单的 shadow-cljs 示例项目中启动并运行 Framework7。

我创建了一个显示两个版本的测试项目，即发生错误的非工作 clojurescript 版本，可以通过以下方式运行：

npx shadow-cljs watch :direct-no-webpack

它使用 client2.cljs

工作版本使用 ES6 导入语法初始化 Framework7，并使用 webpack 进行转译。

yarn run build-dev
npx shadow-cljs watch :direct

它会产生上述错误。

我不详细了解，因为涉及多个包装器，Framework7 中到底发生了什么。

如何正确导入和使用带有 Clojurescript 和 Shadow-CLJS 的 Framework7？

4

2 回答 2

0

即使我阅读了 关于如何使用 npm 包的 shadow-clj 指南。我必须使用node_modules目录中 Javascript 文件的直接路径。

正确的进口是：

(ns app.ui.client2
  (:require
     ["framework7/framework7-lite.esm.bundle.js" :default Framework7]
     ["framework7-react/framework7-react.esm.js" :default Framework7React]))

我修改了我的问题中提到的测试项目。

于 2020-01-29T09:32:23.600 回答
0

我对 Framework7 一无所知，但通常最好遵循最基本的说明。在这种情况下，我没有添加额外的构建配置，只是直接需要这些包。

(ns foo.bar
  (:require
     ["framework7" :as f7]
     ["framework7-react" :as f7r]))

;; avoiding top-level side-effects because of hot-reload
(defn init []
   (.use f7 f7r))

我不知道这是否真的有效，但它没有引发错误。避免直接访问“.esm.js”文件，因为如果您访问这些文件可能会导致冲突，但“framework7-react”访问的是不同的文件。目前还不能很好地支持混合 CommonJS 和 ESM 文件。

.css不支持导入shadow-cljs。

于 2020-01-29T09:10:39.137 回答