Atlassian Front-End Server utilities

Atlassian Developer Tools
,
1

https://bitbucket.org/atlassianlabs/fe-server/src/master/

Are these utilities for public use? It sounds like this would make i18n + react very simple, but I cannot get it to work. A barebones example app would be great to determine what is missing.

1 Like
2

Re: public use – it is published under an Apache license. :slight_smile:

Re: example app – lets ask the author. :slight_smile: @madamczak can you help out @mike1 with that?

2 Likes
3

I just need to see what part of the puzzle I am missing. I will try to show you guys an example of what I have with atlas-create-jira-plugin soon - but in the meantime if someone happens to have one thats great.

1 Like
4

HI @mike1, the FE NPM packages are indeed intended to be publicly used to build Atlassian Server products and plugins. You should be able to find the manual in each of the README.md files or on the NPM page:

You should also try checking the Webpack WRM package if you are not using it yet. It will help you with building modern Front-End applications:

Let me know if you have any further questions about the usage.

Thanks,
Maciej

2 Likes
5

Thanks for clarifying its status. Through the process of creating a blank plugin I have translations working, so it must be a problem in my other project. Thanks again!

6

I’m having the same issue rn.
There seems to be an issue with webpack in dev mode when I18n.getText translates into something like i18n__WEBPACK_IMPORTED_MODULE_10__["I18n"].getText.
The production mode seems to be working fine, not sure if it’s related to minification.

7

Hi @a.belostotskiy, are you by any chance using Babel 7?

If so, this a known bug that we have found this week and we will have to fix it in both webresource Java plugin and in the properties loader NPM package. I have just raised an issue for that, so you can track the status:

As for now, the only alternative is to temporarily downgrade your code to use Babel 6 if this is possible.

Thanks,
Maciej

1 Like
8

Yep, looks like it.
I’ve added @babel/plugin-transform-modules-commonjs babel plugin in dev mode for now, which seems to be a valid workaround aswell.

1 Like
9

Hi!
Figured I’d ask here since it seems to be a good place to get input.
I’m using the WRM plugin together with the atlassian soy-loader. I was wondering if anyone has a solution for loading images through Webpack in the soy templates. Currently using the old way we have a defined image namespace in the atlassian-plugin.xml:
<resource type="download" name="images/" location="/images"/>
And from that we can specify the image url in a soy template:
<img src="{contextPath()}/download/resources/plugin.key/images/avatar.png" class="avatar">
Would there be any way of utilizing a file loader here?

Also, any update on the ticket regarding compatibility with Babel 7?

Best regards,
Dennis.

10

Hey @rw-dennis,

I reckon you should be able to pass the image into your soy template directly from your module. Something like this should work for you:

import myImage from './my-image.jpg';
import { mySoyTemplate } from './my-template.soy';

const template = mySoyTemplate({
   imagePath: myImage,
});

./my-template.soy

{namespace .foo}
/**
 * @param imagePath
 */
{template .mySoyTemplate}
<div>
  <img src="{$imagePath}" />
</div>
{/template}

The bug was fixed in most of the old versions of webresource plugin. You can check the Changelog file to narrow down what version contains the fix:

  • 3.5.44+
  • 3.6.6+
  • 3.7.2+
  • 4.0.7+
  • 4.1.3+
  • 4.2.0+

Thanks,
Maciej

2 Likes