vite#InlineConfig TypeScript Examples

The following examples show how to use vite#InlineConfig. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: index.test.ts    From reskript with MIT License 6 votes vote down vote up 
build = async (classNamesModule: string) => {
    const config: InlineConfig = {
        root: path.join(currentDirectory, 'fixtures'),
        logLevel: 'warn',
        plugins: [
            cssBind({classNamesModule}),
        ],
    };
    const bundle = await vite.build(config) as RollupOutput;
    return bundle.output[0].code;
}
Example #2
Source File: index.test.ts    From reskript with MIT License 6 votes vote down vote up 
build = async () => {
    const config: InlineConfig = {
        root: path.join(currentDirectory, 'fixtures'),
        logLevel: 'warn',
        plugins: [
            cssForceModules(),
        ],
    };
    const bundle = await vite.build(config) as RollupOutput;
    const cssAsset = bundle.output.find(v => path.extname(v.fileName) === '.css');
    return cssAsset?.type === 'asset' ? cssAsset.source.toString() : '';
}
Example #3
Source File: index.test.ts    From reskript with MIT License 6 votes vote down vote up 
build = async (options?: Options) => {
    const config: InlineConfig = {
        root: path.join(currentDirectory, 'fixtures'),
        logLevel: 'warn',
        plugins: [
            svgToComponent(options),
        ],
    };
    const bundle = await vite.build(config) as RollupOutput;
    return bundle;
}
Example #4
Source File: index.test.ts    From reskript with MIT License 6 votes vote down vote up 
build = async (options: Pick<VirtualEntryOptions, 'favicon'>) => {
    const entries = [
        createEntry('index'),
        createEntry('about'),
    ];
    const entryOptions: VirtualEntryOptions = {
        ...options,
        entries,
        publicPath: '/',
        defaultEntry: entries[0],
        buildTarget: 'stable',
        customizeMiddleware: () => {},
    };
    const config: InlineConfig = {
        root: path.join(currentDirectory, 'fixtures'),
        logLevel: 'warn',
        build: {
            rollupOptions: {
                input: Object.entries(entries).reduce(
                    (input, [name, {entry}]) => Object.assign(input, {[name]: entry}),
                    {} as Record<string, string>
                ),
            },
        },
        plugins: [
            virtualEntry(entryOptions),
        ],
    };
    const bundle = await vite.build(config) as RollupOutput;
    return {
        assets: bundle.output.filter((v: any): v is OutputAsset => v.type === 'asset'),
        chunks: bundle.output.filter((v: any): v is OutputChunk => v.type === 'chunk'),
    };
}
Example #5
Source File: vite.config.ts    From fect with MIT License 6 votes vote down vote up 
useDevConfig = async (): Promise<InlineConfig> => {
  const { userConfig } = await resolveConfig()
  const { port, plugins, viteConfigure } = userConfig

  const presetConfig = {
    root: CWD,
    resolve: {
      extensions: VITE_RESOLVE_EXTENSIONS,
      alias: {}
    },
    server: {
      port
    },
    plugins: [Vue({ include: [/\.vue$/, /\.md$/] }), Jsx(), ...plugins]
  }

  return merge(presetConfig, viteConfigure)
}
Example #6
Source File: vite.config.ts    From fect with MIT License 6 votes vote down vote up 
useUMDconfig = (input, name, mini = false): InlineConfig => {
  return {
    logLevel: 'silent',
    build: {
      lib: {
        name,
        formats: ['umd'],
        fileName: mini ? `${name}.min` : `${name}`,
        entry: input
      },
      minify: mini ? 'terser' : false,
      rollupOptions: {
        external: ['vue'],
        output: {
          assetFileNames: (assetInfo) => {
            if (assetInfo.name === 'style.css') return 'main.css'
          },
          dir: UMD_PATH,
          exports: 'named',
          globals: {
            vue: 'Vue'
          }
        }
      }
    }
  }
}
Example #7
Source File: index.ts    From vite-ssr with MIT License 6 votes vote down vote up 
async function generatePackageJson(
  viteConfig: ResolvedConfig,
  clientBuildOptions: InlineConfig,
  serverBuildOptions: NonNullable<BuildOptions['serverOptions']>
) {
  if (serverBuildOptions.packageJson === false) return

  const outputFile = (
    serverBuildOptions.build?.rollupOptions?.output as OutputOptions
  )?.file

  const ssrOutput = path.parse(
    outputFile ||
      ((viteConfig.build?.ssr || serverBuildOptions.build?.ssr) as string)
  )

  const moduleFormat =
    (viteConfig.build?.rollupOptions?.output as OutputOptions)?.format ||
    (serverBuildOptions.build?.rollupOptions?.output as OutputOptions)?.format

  const packageJson = {
    main: outputFile ? ssrOutput.base : ssrOutput.name + '.js',
    type: /^esm?$/i.test(moduleFormat || '') ? 'module' : 'commonjs',
    ssr: {
      // This can be used later to serve static assets
      assets: (
        await fs.readdir(clientBuildOptions.build?.outDir as string)
      ).filter((file) => !/(index\.html|manifest\.json)$/i.test(file)),
    },
    ...(serverBuildOptions.packageJson || {}),
  }

  await fs.writeFile(
    path.join(serverBuildOptions.build?.outDir as string, 'package.json'),
    JSON.stringify(packageJson, null, 2),
    'utf-8'
  )
}
Example #8
Source File: vite.config.ts    From fect with MIT License 5 votes vote down vote up 
useBuildConfig = async (): Promise<InlineConfig> => {
  const devConf = await useDevConfig()
  return {
    base: '/',
    mode: 'production',
    ...devConf
  }
}
Example #9
Source File: server.ts    From vite-ssr with MIT License 5 votes vote down vote up 
export async function createSsrServer(
  options: InlineConfig & { polyfills?: boolean } = {}
) {
  // Enable SSR in the plugin
  process.env.__DEV_MODE_SSR = 'true'

  const viteServer = await createViteServer({
    ...options,
    server: options.server || { ...options },
  })

  if (options.polyfills !== false) {
    if (!globalThis.fetch) {
      const fetch = await import('node-fetch')
      // @ts-ignore
      globalThis.fetch = fetch.default || fetch
    }
  }

  const isMiddlewareMode =
    // @ts-ignore
    options?.middlewareMode || options?.server?.middlewareMode

  return new Proxy(viteServer, {
    get(target, prop, receiver) {
      if (prop === 'listen') {
        return async (port?: number) => {
          const server = await target.listen(port)

          if (!isMiddlewareMode) {
            printServerInfo(server)
          }

          return server
        }
      }

      return Reflect.get(target, prop, receiver)
    },
  })
}
Example #10
Source File: vite.ts    From vanilla-extract with MIT License 5 votes vote down vote up 
startViteFixture = async (
  fixtureName: string,
  { mode = 'development', port = 3000 }: ViteFixtureOptions,
): Promise<TestServer> => {
  const root = path.dirname(
    require.resolve(`@fixtures/${fixtureName}/package.json`),
  );

  const config: InlineConfig = {
    configFile: false,
    root,
    logLevel: 'error',
    plugins: [vanillaExtractPlugin()],
    server: {
      port,
      force: true,
    },
    build: {
      cssCodeSplit: false,
    },
  };

  if (mode === 'development') {
    const server = await createServer(config);

    await server.listen();

    return {
      type: 'vite',
      url: `http://localhost:${port}`,
      close: () => {
        return server.close();
      },
    };
  }

  const result = await build(config);
  const closeServer = await serveAssets({ port, dir: path.join(root, 'dist') });

  if (!('output' in result)) {
    throw new Error('Unexpected build output');
  }

  const { fileName: stylesheet } =
    result.output.find((asset) => asset.name?.endsWith('.css')) || {};

  return {
    type: 'vite',
    url: `http://localhost:${port}`,
    stylesheet,
    close: closeServer,
  };
}