# 404 error while developing custom datasource plugin

**URL:** <https://community.grafana.com/t/404-error-while-developing-custom-datasource-plugin/7907>\
**Category:** Grafana Plugin Development\
**Created:** [June 5, 2018, 3:16pm UTC](https://community.grafana.com/t/404-error-while-developing-custom-datasource-plugin/7907 "2018-06-05T15:16:19Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![adeq](https://avatars.discourse-cdn.com/v4/letter/a/a4c791/32.png) [@adeq](https://community.grafana.com/u/adeq)\
**Post date:** [June 5, 2018, 3:16pm UTC](https://community.grafana.com/t/404-error-while-developing-custom-datasource-plugin/7907/1 "2018-06-05T15:16:19Z")

</div>

I am developing a datasource plugin but I am running into a rather strange issue. Below is some context to our problem.

The first issue I encountered was knowing how to include npm modules in the browser so grafana can use them (node-rest-client-promise, for example). This GitHub issue: [https://github.com/grafana/simple-json-datasource/issues/19](https://github.com/grafana/simple-json-datasource/issues/19) says to copy the modules into the src folder (it seems like grafana does not look in the node\_modules directory) in order to make it accessible to grafana via the browser.

This led to another issue with require statements not being understood by the browser so I am using webpack to bundle the modules and make such statements understandable to the browser.

However, in doing this, webpack does not understand the path ‘app/plugins/sdk’ in the queryCtrl for importing the queryCtrl class. I came across the following Stack Overflow post:

[https://stackoverflow.com/questions/47624327/typescript-import-paths](https://stackoverflow.com/questions/47624327/typescript-import-paths).

Which suggests using grafana-sdk-mocks to fix this path issue. So I copied over the module into the src folder but it doesn’t show up in the browser and it seems that something is appending a .js extension to the path.

Error Message when attempting to select our custom datasource plugin:

`Failed to load resource: the server responded with a status of 404 (Not Found) row_ctrl.ts:73 Plugin component error Error: Fetch error: 404 Not Found Instantiating http://www.community.grafana.com/public/plugins/name-of-plugin/libs/grafana-sdk-mocks/app/plugins/sdk.ts.js.` \<= here is the appended .js  
`Loading http://www.community.grafana.com/public/plugins/name-of-plugin/query_ctrl.js Loading plugins/name-of-plugin-datasource/module at index.js:20`  
The grafana documentation is not very clear as to how grafana looks for imported modules nor how it resolves the ‘app/plugins/sdk’ path since it is nowhere to be found locally.

=====

Technologies we are using:  
Grunt =\> Used to copy from the src/ directory to the dist/ directory and handle babel transpilation  
Babel =\> Used to transpile from ES6 to ES5 standards  
Webpack =\> Used to bundle node modules and make them accessible to grafana via the browser

Our pipeline:  
$ webpack

$ grunt && brew services restart grafana

Grafana was installed using these steps:  
$ brew update

$ brew install grafana

$ brew tap homebrew/services

$ brew services start grafana

Any help would be greatly appreciated!

---

<div class="post-metadata">

**Author:** ![cantankerousbullmoos](https://avatars.discourse-cdn.com/v4/letter/c/9dc877/32.png) [@cantankerousbullmoos](https://community.grafana.com/u/cantankerousbullmoos)\
**Post date:** [July 11, 2018, 3:49pm UTC](https://community.grafana.com/t/404-error-while-developing-custom-datasource-plugin/7907/2 "2018-07-11T15:49:55Z")

</div>

The advice about copying third party modules, in general, only applies to libraries which are otherwise not part of Grafana. The intention of grafana-sdk-mocks is to be a ‘stand-in’ interface that provides enough interface information for TypeScript to compile, and then the real modules will be supplied by the environment that Grafana loads the plugin into.

TLDR: grafana mocks and anything in node\_modules/@types should be left in the node\_modules folder, not moved into a lib folder.