Полимерная сборка с пользовательскими плагинами babel?

Question

Мы хотели бы иметь возможность добавлять пользовательские функции в polymer build а также polymer serve путем настройки пользовательских плагинов Babel.

Например, так как Polymer-Cli использует Babel внутри, мы бы добавили babel.config.js файл в нашу рабочую область / проект-корень, например:

module.exports = function (api) {

  api.cache(true);


  const presets = [ ];
  const plugins = [
 "@babel/plugin-proposal-optional-chaining"
 ];


  return {
    presets,
    plugins
  };
}

... а затем мы могли бы обслуживать или создавать наш проект с поддержкой необязательных цепочек и т. д. Это позволило бы нам делать все что угодно, написав дополнительные плагины Babel для обработки таких вещей, как минимизация внутри строк HTML-шаблона...

К сожалению, в настоящее время это не работает. polymer-build кажется, загружает конфигурацию (из-за использования babel/core?), но polymer-analyze не делает. Ошибка генерируется на этапе оптимизации сборки, выполняемом Polymer-Analysis, как только он встречает необязательный синтаксис цепочки в нашем источнике:

error:  Error: Unable to get document file:///.../somefile.js: This experimental syntax requires enabling the parser plugin:  
'optionalChaining' (423:6)  
    at BuildAnalyzer.<anonymous> (/usr/local/share/.config/yarn/global/node_modules/polymer-build/lib/analyzer.js:342:23)
    at Generator.next (<anonymous>)  
    at fulfilled  (/usr/local/share/.config/yarn/global/node_modules/polymer-build/lib/analyzer.js:17:58)
    at process._tickCallback (internal/process/next_tick.js:68:7)

polymer serve также выдает ошибку:

Error { SyntaxError: This experimental syntax requires enabling the parser plugin: 'optionalChaining' (423:6)
    at Parser.raise (/usr/local/share/.config/yarn/global/node_modules/babylon/lib/index.js:776:15)  
    at Parser.expectPlugin (/usr/local/share/.config/yarn/global/node_modules/babylon/lib/index.js:2084:18)  
...   
pos: 13056,   loc: Position { line: 423, column: 6 },  
missingPlugin: [ 'optionalChaining' ] }

В обоих случаях я подтвердил, что babel.config.js файл загружается. Но babel входит в несколько различных пакетов, используемых в Polymer-Cli, поэтому я подозреваю, что в некоторых из них babel используется без (конфигурации, загруженной babel / core) информации.

Может ли кто-либо из участников проекта по полимерам подтвердить, правильно ли я определил основную проблему? Я изучаю возможность внесения исправления / улучшения, если область не слишком велика.

Благодарю.

Answer 1

Я думаю, что для этого вам нужно написать свою собственную сборку. Polymer-cli предоставит свой инструмент и для этого. Посмотрите на этот пример: https://github.com/PolymerElements/generator-polymer-init-custom-build

Answer 2

Для нас эта проблема мешала нам использовать современные функции языка JS (такие как необязательная цепочка и нулевой оператор объединения), которые широко поддерживаются в современных браузерах.

Единственное решение, которое мы могли придумать, это разветвление Polymer. toolsmonorepo и добавление поддержки соответствующих плагинов Babel самостоятельно.

---

Рассматриваемый файл /packages/build/src/js-transform.ts. Оба serveа также buildиспользуйте этот файл для преобразований Babel. Мы переключились на использование Rollup для нашего процесса сборки, но нам по-прежнему требовался сервер разработки, и мы не могли заставить работать другие, поэтому мы разветвили репозиторий и создали собственную версию автономного сервера. polyserveупаковка. Хотел бы когда-нибудь перейти на Modern Web@web/dev-server.