Clojurescript с webpack и infer-externs требует неопределенного объекта с расширенной компиляцией - PullRequest
Новая
       26

Clojurescript с webpack и infer-externs требует неопределенного объекта с расширенной компиляцией

0 голосов
/ 08 июля 2019

Я следовал этому руководству при использовании webpack + clojurescript, https://clojurescript.org/guides/webpack. Он отлично работает при компиляции с :none или :whitespace, но когда я компилирую с :advanced, один из объекты, подключенные к window, в конечном итоге импортируются как неопределенный объект, вызывая сбой приложения.

Я попробовал пару вещей, таких как определение и externs.js с оконным объектом, но мне трудно глубже в этом разобраться.

Это мои аргументы компилятора: 

{:source-paths ["src/cljs" "src/cljc" "env/prod/cljs"]
             :compiler
             {:output-to     "target/cljsbuild/public/js/app.js"
              :output-dir    "target/cljsbuild/public/js"
              :source-map    "target/cljsbuild/public/js/app.js.map"
              :optimizations :advanced
              :infer-externs true
              :pretty-print  false
              :npm-deps      false
              :foreign-libs [{:file "dist/index_bundle.js"
                              :provides ["react" "react-dom" "react-select" "react-table"]
                              :global-exports {react React
                                               react-dom ReactDOM
                                               react-select Select
                                               react-table ReactTable}}]}}

Это мой index.js, точка входа для веб-пакета 

// Here we define what we need.
// Webpack is gonna use this and produce a bundle.
// cljs will read this bundle and provide the namespaces for us.
import React from 'react';
import ReactDOM from 'react-dom';
import Select from 'react-select';
import ReactTable from 'react-table'

window.React = React;
window.ReactDOM = ReactDOM;
window.Select = Select;
window.ReactTable = ReactTable

Настройка веб-пакета так же проста, как 

module.exports = {
    entry: './src/js/index.js',
    output: {
        filename: 'index_bundle.js'
    }
}

Я получаю ошибку, потому что для файла, подобного этому: 

(ns foo
  (:require
   [react-table :as ReactTable]
   [reagent.core :as r]
   [clojure.string :as str]))
[...]
(r/adapt-react-class ReactTable)

ReactTable связан с nil. Я могу подтвердить, что на консоли js window.ReactTable также nil.

Простое изменение :advanced на :whitespace в опциях компилятора и оставление всего остального как есть, решает проблему. А в консоли js window.ReactTable больше не nil.

Есть идеи? :)

----- EDIT (добавление информации об обходном пути) --------

Я обнаружил, что возможный обходной путь для этого варианта использования - это "разбить" foreign-libs следующим образом: 

              :foreign-libs [{:file "dist/main.js"
                              :provides ["react" "react-dom" "react-select"]
                              :global-exports {react React
                                               react-dom ReactDOM
                                               react-select Select}}
                             {:file "dist/react_table.js"
                              :requires ["react" "react-dom"]
                              :provides ["react-table"]
                              :global-exports {react-table ReactTable}}]}}

При адаптации конфигурации веб-пакета и точек входа создаются два отдельных пакета, один из которых имеет только ReactTable, а другой - со всеми остальными. Я не считаю это решением, потому что настоящая проблема не была идентифицирована. Но это решает проблему.

1 Ответ

0 голосов
/ 09 июля 2019

Определенно, у вас возникают проблемы с продвинутой оптимизацией, путающейся с именами библиотек, которые вы используете, но , в зависимости от вашего варианта использования, вам может не понадобиться использовать Webpack вообще (не уверен, что еслиэто вариант для вас).

Кажется, что библиотеки, которые вы используете, достаточно популярны, чтобы охватить их проектом CLJSJS , так что если вы найдете нужные вам версии,Вы можете добавить библиотеки как обычные зависимости в ваш файл project.clj, и он должен просто работать.Пакеты из CLJSJS включают в себя информацию о зависимостях и файлы externs, которые удобно упакованы.

Наконец, возможно, вы наткнулись на ошибку в старой версии ClojureScript.Проверьте, используете ли вы самую последнюю версию или, возможно, более старую.

...