@teambit/bundler 0.0.555 → 0.0.559

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@teambit/bundler",
-  "version": "0.0.555",
+  "version": "0.0.559",
   "homepage": "https://bit.dev/teambit/compilation/bundler",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.compilation",
     "name": "bundler",
-    "version": "0.0.555"
+    "version": "0.0.559"
   },
   "dependencies": {
     "@teambit/harmony": "0.2.11",
@@ -15,13 +15,13 @@
     "lodash": "4.17.21",
     "@babel/runtime": "7.12.18",
     "core-js": "^3.0.0",
-    "@teambit/envs": "0.0.555",
-    "@teambit/cli": "0.0.386",
-    "@teambit/component": "0.0.555",
-    "@teambit/graphql": "0.0.555",
-    "@teambit/pubsub": "0.0.555",
-    "@teambit/builder": "0.0.555",
-    "@teambit/toolbox.network.get-port": "0.0.90"
+    "@teambit/envs": "0.0.559",
+    "@teambit/cli": "0.0.389",
+    "@teambit/component": "0.0.559",
+    "@teambit/graphql": "0.0.559",
+    "@teambit/pubsub": "0.0.559",
+    "@teambit/builder": "0.0.559",
+    "@teambit/toolbox.network.get-port": "0.0.93"
   },
   "devDependencies": {
     "@types/lodash": "4.14.165",
@@ -34,7 +34,7 @@
   },
   "peerDependencies": {
     "@apollo/client": "^3.0.0",
-    "@teambit/legacy": "1.0.172",
+    "@teambit/legacy": "1.0.175",
     "react-dom": "^16.8.0 || ^17.0.0",
     "react": "^16.8.0 || ^17.0.0"
   },
@@ -62,12 +62,27 @@
         "react": "-"
       },
       "peerDependencies": {
-        "@teambit/legacy": "1.0.172",
+        "@teambit/legacy": "1.0.175",
         "react-dom": "^16.8.0 || ^17.0.0",
         "react": "^16.8.0 || ^17.0.0"
       }
     }
   },
+  "files": [
+    "dist",
+    "!dist/tsconfig.tsbuildinfo",
+    "**/*.md",
+    "**/*.mdx",
+    "**/*.js",
+    "**/*.json",
+    "**/*.sass",
+    "**/*.scss",
+    "**/*.less",
+    "**/*.css",
+    "**/*.css",
+    "**/*.jpeg",
+    "**/*.gif"
+  ],
   "private": false,
   "engines": {
     "node": ">=12.22.0"

package/tsconfig.json

@@ -15,9 +15,9 @@
     "skipLibCheck": true,
     "moduleResolution": "node",
     "esModuleInterop": true,
-    "outDir": "dist",
     "composite": true,
     "emitDeclarationOnly": true,
+    "outDir": "dist",
     "experimentalDecorators": true,
     "emitDecoratorMetadata": true,
     "allowSyntheticDefaultImports": true,

package/browser-runtime.ts

@@ -1,5 +0,0 @@
-import { ExecutionContext } from '@teambit/envs';
-
-export type BrowserRuntime = {
-  entry: (context: ExecutionContext) => Promise<string[]>;
-};

package/bundle.ts

@@ -1,3 +0,0 @@
-export class Bundle {
-  constructor(readonly errors: Error) {}
-}

package/bundler.aspect.ts

@@ -1,5 +0,0 @@
-import { Aspect } from '@teambit/harmony';
-
-export const BundlerAspect = Aspect.create({
-  id: 'teambit.compilation/bundler',
-});

package/bundler.main.runtime.ts

@@ -1,138 +0,0 @@
-import PubsubAspect, { PubsubMain } from '@teambit/pubsub';
-import { MainRuntime } from '@teambit/cli';
-import { Component, ComponentAspect } from '@teambit/component';
-import { EnvsAspect, EnvsMain } from '@teambit/envs';
-import { GraphqlAspect, GraphqlMain } from '@teambit/graphql';
-import { Slot, SlotRegistry } from '@teambit/harmony';
-import { BrowserRuntime } from './browser-runtime';
-import { BundlerAspect } from './bundler.aspect';
-import { ComponentServer } from './component-server';
-import { BundlerContext } from './dev-server-context';
-import { devServerSchema } from './dev-server.graphql';
-import { DevServerService } from './dev-server.service';
-
-export type BrowserRuntimeSlot = SlotRegistry<BrowserRuntime>;
-
-export type BundlerConfig = {
-  dedicatedEnvDevServers: string[];
-};
-
-/**
- * bundler extension.
- */
-export class BundlerMain {
-  constructor(
-    readonly config: BundlerConfig,
-    /**
-     * Pubsub extension.
-     */
-    private pubsub: PubsubMain,
-
-    /**
-     * environments extension.
-     */
-    private envs: EnvsMain,
-
-    /**
-     * dev server service.
-     */
-    private devService: DevServerService,
-
-    /**
-     * browser runtime slot.
-     */
-    private runtimeSlot: BrowserRuntimeSlot
-  ) {}
-
-  /**
-   * load all given components in corresponding dev servers.
-   * @param components defaults to all components in the workspace.
-   */
-  async devServer(components: Component[]): Promise<ComponentServer[]> {
-    const envRuntime = await this.envs.createEnvironment(components);
-    // TODO: this must be refactored away from here. this logic should be in the Preview.
-    const servers: ComponentServer[] = await envRuntime.runOnce<ComponentServer[]>(this.devService, {
-      dedicatedEnvDevServers: this.config.dedicatedEnvDevServers,
-    });
-    this._componentServers = servers;
-
-    this.indexByComponent();
-
-    return this._componentServers;
-  }
-
-  /**
-   * get a dev server instance containing a component.
-   * @param component
-   */
-  getComponentServer(component: Component): undefined | ComponentServer {
-    if (!this._componentServers) return undefined;
-    const envId = this.envs.getEnvId(component);
-    const server = this._componentServers.find(
-      (componentServer) =>
-        componentServer.context.relatedContexts.includes(envId) || componentServer.context.id === envId
-    );
-
-    return server;
-  }
-
-  /**
-   * compute entry files for bundling components in a given execution context.
-   */
-  async computeEntries(context: BundlerContext) {
-    const slotEntries = await Promise.all(
-      this.runtimeSlot.values().map(async (browserRuntime) => browserRuntime.entry(context))
-    );
-
-    const slotPaths = slotEntries.reduce((acc, current) => {
-      acc = acc.concat(current);
-      return acc;
-    });
-
-    return slotPaths;
-  }
-
-  /**
-   * register a new browser runtime environment.
-   * @param browserRuntime
-   */
-  registerTarget(browserRuntime: BrowserRuntime[]) {
-    browserRuntime.map((runtime) => {
-      return this.runtimeSlot.register(runtime);
-    });
-
-    return this;
-  }
-
-  /**
-   * component servers.
-   */
-  private _componentServers: null | ComponentServer[];
-
-  private indexByComponent() {}
-
-  static slots = [Slot.withType<BrowserRuntime>()];
-
-  static runtime = MainRuntime;
-  static dependencies = [PubsubAspect, EnvsAspect, GraphqlAspect, ComponentAspect];
-
-  static defaultConfig = {
-    dedicatedEnvDevServers: [],
-  };
-
-  static async provider(
-    [pubsub, envs, graphql]: [PubsubMain, EnvsMain, GraphqlMain],
-    config,
-    [runtimeSlot]: [BrowserRuntimeSlot]
-  ) {
-    const devServerService = new DevServerService(pubsub, runtimeSlot);
-    const bundler = new BundlerMain(config, pubsub, envs, devServerService, runtimeSlot);
-    envs.registerService(devServerService);
-
-    graphql.register(devServerSchema(bundler));
-
-    return bundler;
-  }
-}
-
-BundlerAspect.addRuntime(BundlerMain);

package/bundler.ts

@@ -1,26 +0,0 @@
-import { Component } from '@teambit/component';
-
-export interface DevServer {
-  start(): void;
-}
-
-export type BundlerResult = {
-  errors: Error[];
-  warnings: string[];
-  components: Component[];
-  /**
-   * timestamp in milliseconds when the task started
-   */
-  startTime?: number;
-
-  /**
-   * timestamp in milliseconds when the task ended
-   */
-  endTime?: number;
-};
-
-export interface Bundler {
-  run(): Promise<BundlerResult[]>;
-}
-
-export type BundlerMode = 'dev' | 'prod';

package/component-server.ts

@@ -1,93 +0,0 @@
-import { Component } from '@teambit/component';
-import { ExecutionContext } from '@teambit/envs';
-import { PubsubMain } from '@teambit/pubsub';
-
-import { AddressInfo } from 'net';
-
-import { DevServer } from './dev-server';
-import { BindError } from './exceptions';
-import { ComponentsServerStartedEvent } from './events';
-import { BundlerAspect } from './bundler.aspect';
-import { selectPort } from './select-port';
-
-export class ComponentServer {
-  // why is this here
-  errors?: Error[];
-  constructor(
-    /**
-     * browser runtime slot
-     */
-    private pubsub: PubsubMain,
-
-    /**
-     * components contained in the existing component server.
-     */
-    readonly context: ExecutionContext,
-
-    /**
-     * port range of the component server.
-     */
-    readonly portRange: number[],
-
-    /**
-     * env dev server.
-     */
-    readonly devServer: DevServer
-  ) {}
-
-  hostname: string | undefined;
-
-  /**
-   * determine whether component server contains a component.
-   */
-  hasComponent(component: Component) {
-    return this.context.components.find((contextComponent) => contextComponent.equals(component));
-  }
-
-  get port() {
-    return this._port;
-  }
-
-  _port: number;
-  async listen() {
-    const port = await selectPort(this.portRange);
-    this._port = port;
-    const server = await this.devServer.listen(port);
-    const address = server.address();
-    const hostname = this.getHostname(address);
-    if (!address) throw new BindError();
-    this.hostname = hostname;
-
-    this.pubsub.pub(BundlerAspect.id, this.createComponentsServerStartedEvent(server, this.context, hostname, port));
-  }
-
-  private getHostname(address: string | AddressInfo | null) {
-    if (address === null) throw new BindError();
-    if (typeof address === 'string') return address;
-
-    let hostname = address.address;
-    if (hostname === '::') {
-      hostname = 'localhost';
-    }
-
-    return hostname;
-  }
-
-  private onChange() {}
-
-  private createComponentsServerStartedEvent: (
-    DevServer,
-    ExecutionContext,
-    string,
-    number
-  ) => ComponentsServerStartedEvent = (componentsServer, context, hostname, port) => {
-    return new ComponentsServerStartedEvent(Date.now(), componentsServer, context, hostname, port);
-  };
-
-  /**
-   * get the url of the component server.
-   */
-  get url() {
-    return `/preview/${this.context.envRuntime.id}`;
-  }
-}

package/dedup-envs.ts

@@ -1,26 +0,0 @@
-import type { ExecutionContext } from '@teambit/envs';
-
-// de-duping dev servers by the amount of type the dev server configuration was overridden by envs.
-export function dedupEnvs(contexts: ExecutionContext[], dedicatedEnvDevServers?: string[]) {
-  const groupedEnvs: Record<string, ExecutionContext[]> = {};
-
-  contexts.forEach((context) => {
-    const envId = getEnvId(context, dedicatedEnvDevServers);
-    if (!envId) return;
-    if (!(envId in groupedEnvs)) groupedEnvs[envId] = [];
-
-    groupedEnvs[envId].push(context);
-  });
-
-  return groupedEnvs;
-}
-
-function getEnvId(context: ExecutionContext, dedicatedServers?: string[]): string | undefined {
-  const id = context.id.split('@')[0];
-
-  if (dedicatedServers?.includes(id)) {
-    return context.id;
-  }
-
-  return context.env?.getDevEnvId(context);
-}

package/dev-server-context.ts

@@ -1,48 +0,0 @@
-import { Component } from '@teambit/component';
-import { BuildContext } from '@teambit/builder';
-import { ExecutionContext } from '@teambit/envs';
-
-export type Target = {
-  /**
-   * entries of the target.
-   */
-  entries: string[];
-
-  /**
-   * array of components included in the target.
-   */
-  components: Component[];
-
-  /**
-   * output path of the target
-   */
-  outputPath: string;
-};
-
-export interface BundlerContext extends BuildContext {
-  targets: Target[];
-  publicPath?: string;
-  rootPath?: string;
-}
-
-export interface DevServerContext extends ExecutionContext {
-  /**
-   * array of files to include.
-   */
-  entry: string[];
-
-  /**
-   * public path.
-   */
-  publicPath: string;
-
-  /**
-   * root path of the workspace.
-   */
-  rootPath: string;
-
-  /**
-   * title of the page.
-   */
-  title?: string;
-}

package/dev-server.graphql.ts

@@ -1,34 +0,0 @@
-import { Component } from '@teambit/component';
-import { Schema } from '@teambit/graphql';
-import { gql } from '@apollo/client';
-
-import { BundlerMain } from './bundler.main.runtime';
-
-// TODO: this has to be refactored to the Preview aspect. with the entire preview logic here.
-export function devServerSchema(bundler: BundlerMain): Schema {
-  return {
-    typeDefs: gql`
-      extend type Component {
-        server: ComponentServer
-      }
-
-      type ComponentServer {
-        env: String
-        url: String
-      }
-    `,
-    resolvers: {
-      Component: {
-        server: (component: Component) => {
-          const componentServer = bundler.getComponentServer(component);
-          if (!componentServer) return {};
-
-          return {
-            env: componentServer.context.envRuntime.id,
-            url: componentServer.url,
-          };
-        },
-      },
-    },
-  };
-}

package/dev-server.service.tsx

@@ -1,150 +0,0 @@
-import { EnvService, ExecutionContext, EnvDefinition } from '@teambit/envs';
-import { PubsubMain } from '@teambit/pubsub';
-import { flatten } from 'lodash';
-import React from 'react';
-import { Text, Newline } from 'ink';
-import highlight from 'cli-highlight';
-import { BrowserRuntimeSlot } from './bundler.main.runtime';
-import { ComponentServer } from './component-server';
-import { dedupEnvs } from './dedup-envs';
-import { DevServer } from './dev-server';
-import { DevServerContext } from './dev-server-context';
-import { getEntry } from './get-entry';
-
-export type DevServerServiceOptions = { dedicatedEnvDevServers?: string[] };
-
-export type DevServerDescriptor = {
-  /**
-   * id of the dev server (e.g. jest/mocha)
-   */
-  id: string;
-
-  /**
-   * display name of the dev server (e.g. Jest / Mocha)
-   */
-  displayName: string;
-
-  /**
-   * icon of the configured dev server.
-   */
-  icon: string;
-
-  /**
-   * string containing the config for display.
-   */
-  config: string;
-
-  version?: string;
-};
-
-export class DevServerService implements EnvService<ComponentServer, DevServerDescriptor> {
-  name = 'dev server';
-
-  constructor(
-    /**
-     * browser runtime slot
-     */
-    private pubsub: PubsubMain,
-
-    /**
-     * browser runtime slot
-     */
-    private runtimeSlot: BrowserRuntimeSlot
-  ) {}
-
-  async render(env: EnvDefinition, context: ExecutionContext[]) {
-    const descriptor = await this.getDescriptor(env, context);
-    return (
-      <Text key={descriptor?.id}>
-        <Text color="cyan">configured dev server: </Text>
-        <Text>
-          {descriptor?.id} ({descriptor?.displayName} @ {descriptor?.version})
-        </Text>
-        <Newline />
-        <Text underline color="cyan">
-          dev server config:
-        </Text>
-        <Newline />
-        <Text>
-          {/* refactor a separate component which highlights for cli */}
-          {highlight(descriptor?.config || '', { language: 'javascript', ignoreIllegals: true })}
-        </Text>
-        <Newline />
-      </Text>
-    );
-  }
-
-  async getDescriptor(
-    environment: EnvDefinition,
-    context?: ExecutionContext[]
-  ): Promise<DevServerDescriptor | undefined> {
-    if (!environment.env.getDevServer || !context) return undefined;
-    const mergedContext = await this.buildContext(context[0], []);
-    const devServer: DevServer = environment.env.getDevServer(mergedContext);
-
-    return {
-      id: devServer.id || '',
-      displayName: devServer.displayName || '',
-      icon: devServer.icon || '',
-      config: devServer.displayConfig ? devServer.displayConfig() : '',
-      version: devServer.version ? devServer.version() : '?',
-    };
-  }
-
-  // async run(context: ExecutionContext): Promise<ComponentServer[]> {
-  //   const devServerContext = await this.buildContext(context);
-  //   const devServer: DevServer = context.env.getDevServer(devServerContext);
-  //   const port = await selectPort();
-  //   // TODO: refactor to replace with a component server instance.
-  //   return new ComponentServer(this.pubsub, context, port, devServer);
-  // }
-
-  async runOnce(
-    contexts: ExecutionContext[],
-    { dedicatedEnvDevServers }: DevServerServiceOptions
-  ): Promise<ComponentServer[]> {
-    const groupedEnvs = dedupEnvs(contexts, dedicatedEnvDevServers);
-
-    const servers = await Promise.all(
-      Object.entries(groupedEnvs).map(async ([id, contextList]) => {
-        const mainContext = contextList.find((context) => context.envDefinition.id === id) || contextList[0];
-        const additionalContexts = contextList.filter((context) => context.envDefinition.id !== id);
-
-        const devServerContext = await this.buildContext(mainContext, additionalContexts);
-        const devServer: DevServer = await devServerContext.envRuntime.env.getDevServer(devServerContext);
-
-        return new ComponentServer(this.pubsub, devServerContext, [3300, 3400], devServer);
-      })
-    );
-
-    return servers;
-  }
-
-  mergeContext() {}
-
-  private getComponentsFromContexts(contexts: ExecutionContext[]) {
-    return flatten(
-      contexts.map((context) => {
-        return context.components;
-      })
-    );
-  }
-
-  /**
-   * builds the execution context for the dev server.
-   */
-  private async buildContext(
-    context: ExecutionContext,
-    additionalContexts: ExecutionContext[] = []
-  ): Promise<DevServerContext> {
-    context.relatedContexts = additionalContexts.map((ctx) => ctx.envDefinition.id);
-    context.components = context.components.concat(this.getComponentsFromContexts(additionalContexts));
-
-    return Object.assign(context, {
-      entry: await getEntry(context, this.runtimeSlot),
-      // don't start with a leading "/" because it generates errors on Windows
-      rootPath: `preview/${context.envRuntime.id}`,
-      publicPath: `/public`,
-    });
-  }
-}

package/dev-server.ts

@@ -1,41 +0,0 @@
-import { Server } from 'http';
-
-/**
- * interface for implementing dev servers.
- */
-export interface DevServer {
-  /**
-   * attach to given port and start an http server
-   */
-  listen(port: number): Server | Promise<Server>;
-
-  /**
-   * display name of the tester.
-   */
-  displayName?: string;
-
-  /**
-   * icon of the tester.
-   */
-  icon?: string;
-
-  /**
-   * serialized config of the tester.
-   */
-  displayConfig?(): string;
-
-  /**
-   * path to the config in the filesystem.
-   */
-  configPath?: string;
-
-  /**
-   * id of the tester.
-   */
-  id: string;
-
-  /**
-   * return the tester version.
-   */
-  version?(): string;
-}

package/events/components-server-started-event.ts

@@ -1,20 +0,0 @@
-/* eslint-disable max-classes-per-file */
-
-import { BitBaseEvent } from '@teambit/pubsub';
-
-class ComponentsServerStartedEventData {
-  constructor(readonly componentsServer, readonly context, readonly hostname, readonly port) {}
-}
-
-export class ComponentsServerStartedEvent extends BitBaseEvent<ComponentsServerStartedEventData> {
-  static readonly TYPE = 'components-server-started';
-
-  constructor(readonly timestamp, readonly componentsServer, readonly context, readonly hostname, readonly port) {
-    super(
-      ComponentsServerStartedEvent.TYPE,
-      '0.0.1',
-      timestamp,
-      new ComponentsServerStartedEventData(componentsServer, context, hostname, port)
-    );
-  }
-}

package/events/index.ts

@@ -1 +0,0 @@
-export * from './components-server-started-event';

package/exceptions/bind-error.ts

@@ -1 +0,0 @@
-export class BindError extends Error {}

package/exceptions/index.ts

@@ -1 +0,0 @@
-export { BindError } from './bind-error';

package/get-entry.ts

@@ -1,31 +0,0 @@
-import { ComponentID } from '@teambit/component';
-import { ExecutionContext } from '@teambit/envs';
-import { GetBitMapComponentOptions } from '@teambit/legacy/dist/consumer/bit-map/bit-map';
-import { PathOsBased } from '@teambit/legacy/dist/utils/path';
-
-import { BrowserRuntimeSlot } from './bundler.main.runtime';
-
-export type ComponentDir = {
-  componentDir?: (
-    componentId: ComponentID,
-    bitMapOptions?: GetBitMapComponentOptions,
-    options?: { relative: boolean }
-  ) => PathOsBased | undefined;
-};
-
-/**
- * computes the bundler entry.
- */
-export async function getEntry(context: ExecutionContext, runtimeSlot: BrowserRuntimeSlot): Promise<string[]> {
-  // TODO: refactor this away from here and use computePaths instead
-  const slotEntries = await Promise.all(
-    runtimeSlot.values().map(async (browserRuntime) => browserRuntime.entry(context))
-  );
-
-  const slotPaths = slotEntries.reduce((acc, current) => {
-    acc = acc.concat(current);
-    return acc;
-  });
-
-  return slotPaths;
-}

package/index.ts

@@ -1,8 +0,0 @@
-export { DevServer } from './dev-server';
-export { BundlerContext, Target, DevServerContext } from './dev-server-context';
-export { Bundler, BundlerResult, BundlerMode } from './bundler';
-export type { BundlerMain } from './bundler.main.runtime';
-export { BundlerAspect } from './bundler.aspect';
-export { ComponentDir } from './get-entry';
-export { ComponentServer } from './component-server';
-export * from './events';

package/select-port.ts

@@ -1,8 +0,0 @@
-import { Port } from '@teambit/toolbox.network.get-port';
-
-/**
- * get an available port between range 3000 to 3200 or from port range
- */
-export async function selectPort(range: number[] | number): Promise<number> {
-  return Port.getPortFromRange(range);
-}

package/types/asset.d.ts

@@ -1,29 +0,0 @@
-declare module '*.png' {
-  const value: any;
-  export = value;
-}
-declare module '*.svg' {
-  import type { FunctionComponent, SVGProps } from 'react';
-
-  export const ReactComponent: FunctionComponent<SVGProps<SVGSVGElement> & { title?: string }>;
-  const src: string;
-  export default src;
-}
-
-// @TODO Gilad
-declare module '*.jpg' {
-  const value: any;
-  export = value;
-}
-declare module '*.jpeg' {
-  const value: any;
-  export = value;
-}
-declare module '*.gif' {
-  const value: any;
-  export = value;
-}
-declare module '*.bmp' {
-  const value: any;
-  export = value;
-}

package/types/style.d.ts

@@ -1,42 +0,0 @@
-declare module '*.module.css' {
-  const classes: { readonly [key: string]: string };
-  export default classes;
-}
-declare module '*.module.scss' {
-  const classes: { readonly [key: string]: string };
-  export default classes;
-}
-declare module '*.module.sass' {
-  const classes: { readonly [key: string]: string };
-  export default classes;
-}
-
-declare module '*.module.less' {
-  const classes: { readonly [key: string]: string };
-  export default classes;
-}
-
-declare module '*.less' {
-  const classes: { readonly [key: string]: string };
-  export default classes;
-}
-
-declare module '*.css' {
-  const classes: { readonly [key: string]: string };
-  export default classes;
-}
-
-declare module '*.sass' {
-  const classes: { readonly [key: string]: string };
-  export default classes;
-}
-
-declare module '*.scss' {
-  const classes: { readonly [key: string]: string };
-  export default classes;
-}
-
-declare module '*.mdx' {
-  const component: any;
-  export default component;
-}