How to use sucrase - 10 common examples

require.extensions['.jsx'] = (_module, filename) => {
    const source = readFileSync(filename, 'utf8');
    const hash = checksum(`/* sucrase-jsx (${sucrase.getVersion()}) | ${filename} */ ${source}`);
    const cached = join(cacheDir, `${hash}.js`);

    try {
      _module._compile(readFileSync(cached, 'utf8'), filename);
    } catch (_) {
      const res = sucrase.transform(source, {
        transforms: [ 'jsx' ],
        filePath: filename
      }).code;

      _module._compile(res, filename);

      writeFile(cached, res, (err) => {
        if (err) {
          console.error('%c[Powercord:JSX]', 'color: #7289da', 'Failed to write to cache');
          console.error(err);
        }
      });
    }
  };

export function process(code) {
	code = `${IMPORTS}${code}`;

	if (!code.match(/[\s\b;,]export[{ ]/)) {
		code = code.replace(
			/([\s\b;,])((async )?(function|class)[\s{])/g,
			'$1export default $2'
		);
	}

	let out = {};
	try {
		out = transform(code, {
			filePath: 'repl.js',
			sourceMapOptions: {
				compiledFilename: 'repl.js'
			},
			transforms: ['jsx', 'typescript', 'imports'],
			// omit _jsxSource junk
			production: true,
			// .default fixing since we're using shim modules
			enableLegacyTypeScriptModuleInterop: true,
			enableLegacyBabel5ModuleInterop: true,
			jsxPragma: 'h',
			jsxFragmentPragma: 'Fragment'
		});
	} catch (err) {
		if (err.name !== 'SyntaxError' && /unexpected\stoken/i.test(err.message)) {
			let old = err;

file: any,
    enc: string,
    // tslint:disable-next-line no-any
    cb: (err?: any, data?: any) => void,
  ): void {
    if (file.isNull()) {
      cb(null, file);
      return;
    }
    if (file.isStream()) {
      cb(new PluginError(PLUGIN_NAME, "Streaming is not supported."));
      return;
    }

    try {
      const resultCode = transform(file.contents.toString(), {filePath: file.path, ...options})
        .code;
      file.contents = Buffer.from(resultCode);
      file.path = replaceExt(file.path, ".js");
      this.push(file);
    } catch (e) {
      e.message = `Error when processing file ${file.path}: ${e.message}`;
      this.emit("error", new PluginError(PLUGIN_NAME, e));
    }

    cb();
  });
}

export default function getTokens(code: string, transforms: Array): string {
  try {
    return getFormattedTokens(code, {transforms});
  } catch (e) {
    // eslint-disable-next-line no-console
    console.error(e);
    return e.message;
  }
}

exports.process = (src, filename) => {
  const transforms = getTransforms(filename);

  if (transforms !== null) {
    const result = transform(src, {
      filePath: filename,
      jsxFragmentPragma: 'Fragment', // Preact style JSX
      jsxPragma: 'h',
      production: true, // Don't add debug attributes to snapshots
      transforms,
    });

    return {
      code: result.code,
      map: result.sourceMap,
    };
  }

  return { code: src, map: '' };
};

if (transpiled) {
          // Ignore async
          if (transpiled instanceof Promise) {
            warn(WARN_SERVER_TRANSPILE);
          } else {
            code = transpiled;
          }
        }
      }

      if (!isModule(code)) {
        return code;
      }

      return sucrase.transform(code, {
        transforms: ['imports'],
        filePath
      }).code;
    },
    {

function getClientEnvironment(publicUrl) {
  const raw = {
    // Useful for determining whether we’re running in production mode.
    // Most importantly, it switches React into the correct mode.
    NODE_ENV: process.env.NODE_ENV || "development",
    // Useful for resolving the correct path to static assets in `public`.
    // For example, <img src="{process.env.PUBLIC_URL">.
    // This should only be used as an escape hatch. Normally you would put
    // images into the `src` and `import` them in code to get their paths.
    PUBLIC_URL: publicUrl,
    // eslint-disable-next-line global-require
    SUCRASE_VERSION: require("sucrase").getVersion(),
  };
  // Stringify all values so we can feed into Webpack DefinePlugin
  const stringified = {
    "process.env": Object.keys(raw).reduce((env, key) =&gt; {
      env[key] = JSON.stringify(raw[key]);
      return env;
    }, {}),
  };

  return {raw, stringified};
}

function loader(code: string): string {
  const webpackRemainingChain = getRemainingRequest(this).split("!");
  const filePath = webpackRemainingChain[webpackRemainingChain.length - 1];
  const options: Options = getOptions(this) as Options;
  return transform(code, {filePath, ...options}).code;
}

const handleJSX = (code) => {
		const transformed = transform(code, options);
		return transformed.code;
	};

export function process(src: string, filename: string): string {
  const transforms = getTransforms(filename);
  if (transforms !== null) {
    return transform(src, {transforms, filePath: filename}).code;
  } else {
    return src;
  }
}