Блог

Главная - Вопросы по программированию - Проблема с использованием исходного файла машинописи из родительской папки

Проблема с использованием исходного файла машинописи из родительской папки

#reactjs #typescript #webpack #visual-studio-code

Вопрос:

У меня есть приложение React, написанное на машинописном/JS, с веб-пакетом (v5.4), используемым для создания. Приложение поддерживает различные конфигурации/платформы, каждая из которых находится в другой папке. Я пытаюсь отделить логику приложения от кода пользовательского интерфейса, специфичного для конфигурации/платформы, и я хотел сделать структуру папок такой:

  • shared код
    • Логические
    • помощники
    • …
  • app-config1
    • Src
    • …
    • tsconfig.json
    • webpack.config.json
    • пакеты.json
  • app-config2
    • Src
    • …
    • tsconfig.json
    • webpack.config.json
    • пакеты.json

и т.д. (каждое приложение-configX с собственным tsconfig,веб-пакетом,пакетами и т.д.)

Я прочитал документацию, несколько обсуждений на Github, а также несколько аналогичных вопросов здесь, и поэтому я попытался добавить «пути» и «включить» в tsconfig.json:

 "baseUrl": "src",
"paths": {
      "@shared/*": ["../../shared/*"],
}

(Я тоже пытался "shared/*": ["../../shared/*"], )

 "include": [
    "src",
    "typings/*.d.ts",
    "../shared"]

Я также попытался добавить resolve.alias в webpack.config.js:

 resolve: {
      extensions: [".ts", ".tsx", ".html", ".js",".json"],
      alias: {
        shared: path.resolve(__dirname, "../shared/")
      }

So with all these extras, I can import a file from the /shared folder to a specific app (opened in VS as a folder, for example app-config1 ) *as either import { CoreLogicFunc } from "shared/logicfunc" or as import { CoreLogicFunc } from "../../shared/logicfunc" * as long as the logicfunc.ts does not import any other packages.
If a file in a «shared» location imports any package like react or axios, I’m getting error messages like:

ОШИБКА в ../shared/logicfunc.tsx Модуль не найден: Ошибка: Не удается разрешить «axios» в «…/git/shared/logicfunc» @ ../shared/logicfunc.tsx 30:32-48 Любой другой импорт также завершается неудачно.

Я надеюсь, что мне чего-то не хватает, так как я не являюсь разработчиком React на полный рабочий день, поэтому я был бы признателен, если бы smb мог указать, чего мне не хватает, чтобы выполнить импорт из родительской папки. Или заверьте меня, что это невозможно сделать с помощью tsc/webpack.

Метки: