Use in browser ?

[vadimpopa]

I see in in readme this: " It could even be used inside a browser.". But looking in code I see is not browser runnable, and in dist there aren't any ems files that I could use, just like prettier has in here https://prettier.io/docs/en/browser.html.

Any thoughts ? Adjusting from cjs to esm would make that possible ? Or maybe extend build to generate esm too ?

[clementdessoude]

The only time I try it was using it approximately like this, but this was a long time ago, I don't ever recall if it was working properly

There might be a better way to do this, or we could try to add a standalone script which would bundle both the base prettier package and the plugin

[lisonge]

you can build it by vite/rollup/webpack/esbuild and note https://github.com/jhipster/prettier-java/issues/547

if you don't want to build, you can use https://github.com/lisonge/pkg-cdn/tree/main/dist/prettier-plugin-java

[vadimpopa]

Thanks guys for help.

@clementdessoude in that repo works indeed, but it is old. The newer packages don't seem to work. @lisonge I've tried to build with the es format but when build in our web pack app it fails at api require:

    build: {
      emptyOutDir: false,
      sourcemap: true,
      rollupOptions: {
        external: ['prettier'],
        output: {
          globals: { prettier: 'prettier' },
        },
      },
      lib: {
        entry: './node_modules/prettier-plugin-java',
        formats: ['es'],
        fileName: (format) => {
          return `prettier-plugin-java/v${prettierPluginJavaPkg.version}.${format}.js`;
        },
        name: `PrettierPluginJava`,
      },
    },

function qE(e) {
  var t = jE({
    name: e.name,
    rules: e.rules
  }), n = new Function("tokenVocabulary", "config", "chevrotain", t);
  return function(r) {
    return n(
      e.tokenVocabulary,
      r,
      require("../api")
    );
  };
}

Seems that build is broken.

[lisonge]

@vadimpopa

What does when build in our web pack app it fails at api require mean ? what is output error ?

I can use prettier-plugin-java in my web app

v2ex-comment-markdown/blob/main/src/format.ts#L6

if you need build es format, you can try this code

(async () => {
  const prettierPluginJavaPkg: Record<string, string> = JSON.parse(
    (
      await fs.readFile('./node_modules/prettier-plugin-java/package.json')
    ).toString('utf-8')
  );
  await build({
    plugins: [
      {
        name: 'fix_process',
        transform(code, id) {
          if (
            id.endsWith('/node_modules/java-parser/src/utils.js') &&
            code.includes('process')
          ) {
            return {
              code: [code, ';globalThis.process = globalThis.process;'].join(
                '\n'
              ),
              map: null,
            };
          }
          return;
        },
      },
    ],
    define: {
      'process.env.NODE_ENV': JSON.stringify(processObj.env.NODE_ENV),
    },
    build: {
      emptyOutDir: false,
      sourcemap: true,
      rollupOptions: {
        external: ['prettier', 'lodash', 'java-parser'],
        output: {
          // globals: { prettier: 'prettier' },
        },
      },
      lib: {
        entry: './node_modules/prettier-plugin-java',
        formats: ['es'],
        fileName: (format) => {
          return `prettier-plugin-java/v${prettierPluginJavaPkg.version}.${format}.js`;
        },
        name: `PrettierPluginJava`,
      },
    },
  });
})();