Problem with fs-extra in content script

Development Plugins
1

Hi,
I have a new problem: my content script works in developer version (joplin desktop, Windows 10). I use fs-extra to read a resource file. But in production version I get log messages: 'fs-extra could not be loaded'. The plugin is not activated for this reason.

Any idea, what the reason is and what I can do?

Thank's

2

The content script is in another thread, you must delegate it to the main thread using postMessage communication

3

Can you share your github repository?

4

So what do you want to do? The repository is public. For code inspection look at this. Or do you want to participate in code development? The code isn't ready yet. But if the plugin works in Joplin, I will publish it.

For postMessage I had a look at the sample code. It uses the webviewApi object. But this is only available (from my knowledge) via HTML webview. I do not have access to such a view as the sample code has with its returned link.

Anyway, thanks.

5

You can get fs-extra from Joplin. Instead of importing it as you normally would use

fs = joplin.require('fs-extra')

API doc

6

Sorry, but nothing works:

  1. joplin.require('fs-extra'); used without joplin import => joplin.require is not a function
  2. import joplin from 'api'; => content script is no module
  3. const joplin = require('api'); => module api not found

Just to mention:

  1. We are in the content script, which is a js file, not the plugin
  2. const fs = require('fs-extra'); works for dev version

With above changes, I can build but dev version does not work anymore.
Or where do I get an instance of joplin?

And this is a piece of the logfile (joplin-desktop, production version)

2021-10-20 09:57:33: joplin.plugins: "Starting plugin: de.habelt.CodeSection"
2021-10-20 09:57:33: joplin.plugins: "Starting plugin: de.habelt.NotesStationImport"
2021-10-20 09:57:34: loadContentScripts: "Cannot find module 'fs-extra'
Require stack:
- C:\Users\jsoft\.config\joplin-desktop\cache\de.habelt.CodeSection\codeExtractor.js
- C:\Users\jsoft\.config\joplin-desktop\cache\de.habelt.CodeSection\markdownItCodeSection.js
- C:\Program Files\Tools\Joplin\resources\app.asar\node_modules\@joplin\lib\shim-init-node.js
- C:\Program Files\Tools\Joplin\resources\app.asar\index.html"
7

Ah, missed that, sorry. Then it won't work as you have already found out.

Try this. In your webpack.config.js:

const extraScriptConfig = Object.assign({}, baseConfig, {
	resolve: {
		alias: {
			api: path.resolve(__dirname, 'api'),
		},
		extensions: ['.tsx', '.ts', '.js'],
	},
	// add the following lines:
	node: {
		"fs-extra": "empty",
	},
	// end
});
8

Could you describe what you actually want to do? What will the plugin do?

9

The README at my Github repository gives a relatively detailed description.

The plugin uses a codesection fence to insert a code section from a code source. I found this useful and did not find any existing possibility to do that. The same concept is used in the Latex Listings package.

10

That didn't help - same log message as before.

11

In my plugin I write some files but I do it in the plugin thread.
The contentScript is sending a message to the plugin using webviewApi.postMessage that is writing the file based on the content inside the markdown fences.

Maybe you could use this approach as well.

This is the plugin I'm talking about:

12

Thanks for your hints.

In the meantime my plugin works. I was not aware of using content scripts in Typescript. After I renamed my two js scripts to ts and after registering the extra scripts it worked very well. Probably I do not need the approach with the messages.

Thanks again, Mick2nd