Блог

Главная - Вопросы по программированию - Условно требуемые модули, включенные в производственную сборку

Условно требуемые модули, включенные в производственную сборку

#javascript #webpack #create-react-app #tree-shaking

#javascript #webpack #create-react-app #встряхивание дерева

Вопрос:

У меня есть приложение, основанное на Create-React-App. Во время разработки я часто настраиваю макет сервера API, запуская скрипт NPM, который задает переменную среды:

 "start": "react-scripts start",
"start:mock-api": "cross-env REACT_APP_MOCK_API=true react-scripts start",
"build": "react-scripts build",

Этот параметр env определяет, должен ли макет сервера раскручиваться:

 if (process.env.REACT_APP_MOCK_API === "true") {
  /* eslint-disable import/no-extraneous-dependencies */
  const { setupWorker } = require("msw");
  const { handlers } = require("src/mockApi/serverHandlers");

  setupWorker(...handlers).start();
}

Сегодня я создал сборку и получил это сообщение:

Размер пакета значительно больше рекомендованного

Я начал просматривать свой пакет и неожиданно наткнулся на искаженный вызов моего макета api setupWorker().start() :

 "true"===Object({NODE_ENV:"production",PUBLIC_URL:"",WDS_SOCKET_HOST:void 0,WDS_SOCKET_PATH:void 0,WDS_SOCKET_PORT:void 0,FAST_REFRESH:!0,REACT_APP_ENV_NAME:"development"})
.REACT_APP_MOCK_API){var jd=n(54)
.setupWorker,Td=n(424).handlers;jd.apply(void 0,Object(i.a)(Td))
.start()}

Я предполагал, что во время сборки prod этот путь будет удален как мертвый код, но, очевидно, это не так. Это проблематично, поскольку у меня есть ссылки на большие файлы JSON в моем макетном API, и они попадают в комплект.

Есть мысли о том, как я могу исключить свой макет модуля api при создании производственной сборки?

Ответ №1:

Чтобы исключить эти условно требуемые модули, требуется, чтобы мы явно установили переменную env в нашем скрипте сборки:

"build": "cross-env REACT_APP_MOCK_API=false react-scripts build"

Метки: ,