Tente de bundle son plugin pour un application web open source GRAFANA

Bonjour à tous !

Je suis entrain de créer un plugin pour une application web open source GRAFANA et je dois bundle mon script pour que ça passe. Hier matin encore je ne savais pas ce que voulait dire bundle, mtn je suis un peu plus instruit mais j'ai encore beaucoup de penne. J'utilise webpack pour faire ça. J'ai écris le fichier de config et je lance la commande npm run build et j'obtiens ça :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
webpack is watching the files…
 
Hash: a7bc696457ae737d1a8d
Version: webpack 4.20.2
Time: 1312ms
Built at: 2018-10-15 10:54:17
 2 assets
Entrypoint module = module.js module.js.map
[0] ./module.js 434 bytes {0} [built]
[1] ./graph.js 8.11 KiB {0} [built] [failed] [1 error]
[2] external "app/plugins/sdk" 42 bytes {0} [built]
 
ERROR in ./graph.js
Module build failed (from ../node_modules/babel-loader/lib/index.js):
SyntaxError: C:\Users\*****\Desktop\grafana-5.2.4.windows-amd64 (1)\grafana-5.2.4\data\plugins\jojo-checkbox-panel\src\graph.js: var is a reserved word (56:2)
 
  54 |          // countries are turned on/off
  55 |
> 56 |          var i = 0;
     |          ^
  57 |          $.each(dataset, function(key, val) {
  58 |                  val.color = i;
  59 |                  ++i;

Voila mon fichier de config :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
 
const path = require('path');
const webpack = require('webpack');
//const CopyWebpackPlugin = require('copy-webpack-plugin');
//const CleanWebpackPlugin = require('clean-webpack-plugin');
//const ReplaceInFileWebpackPlugin = require('replace-in-file-webpack-plugin');
 
const packageJson = require('./package.json');
 
 
module.exports = {
  node: {
    fs: 'empty',
  },
  context: path.join(__dirname, 'src'),
  entry: {
    module: './module.js',
  },
  devtool: 'source-map',
  output: {
    filename: '[name].js',
    path: path.join(__dirname, 'dist'),
    libraryTarget: 'amd',
  },
  //option:{mode:development},
performance: {hints: false},
  externals: [
    //'lodash',
    'jquery',
    'flot',
    function(context, request, callback) {
      var prefix = 'app/';
      if (request.indexOf(prefix) === 0) {
        return callback(null, request);
      }
      callback();
    },
  ],
 
  resolve: {
    extensions: ['.ts', '.tsx', '.js'],
	},
  module: {
    rules: [
      {
        test: /\.js$/,
        loaders: [
          {
            loader: 'babel-loader',
            options: {presets: ['env']},
          },
		],
      },
      {
        test: /\.css$/,
        use: [{ loader: "style-loader" }, { loader: "css-loader" }]
      },
      {
        test: /\.(jpg|gif|png|svg)$/,
        loader: "file-loader"
      },
      {
        test: /\.(ttf|woff|woff2|eot)/,
        loader: "file-loader"
      }
    ],
  },
  // webpack se lancera tout le temps en mode watch
  watch: true
};

J'ai du mal à comprendre ce qu'il veut, pourquoi il me laisse pas utilisé les expressions js :s

Quelqu'un saurait ce qu'il se passe ??

Un grand merci à ceux qui prendront le temps :D