@grafana/create-plugin 1.11.0-canary.365.32f6dfa.0 → 1.12.0

package/CHANGELOG.md

@@ -1,3 +1,27 @@
+# v1.12.0 (Fri Aug 18 2023)
+
+#### 🚀 Enhancement
+
+- create-plugin: Add link to documentation about troubleshooting create-plugin on windows [#365](https://github.com/grafana/plugin-tools/pull/365) ([@Ukochka](https://github.com/Ukochka))
+
+#### Authors: 1
+
+- Yulia Shanyrova ([@Ukochka](https://github.com/Ukochka))
+
+---
+
+# v1.11.0 (Wed Aug 16 2023)
+
+#### 🚀 Enhancement
+
+- create-plugin: Enable webpack watchOption -> poll if WSL is detected [#356](https://github.com/grafana/plugin-tools/pull/356) ([@Ukochka](https://github.com/Ukochka))
+
+#### Authors: 1
+
+- Yulia Shanyrova ([@Ukochka](https://github.com/Ukochka))
+
+---
+
 # v1.10.1 (Mon Aug 14 2023)
 
 #### 🐛 Bug Fix

package/README.md

@@ -20,7 +20,7 @@ Create Grafana plugins with ease.
 
 - [Plugin Tools docs](https://grafana.github.io/plugin-tools/)
 - [Plugin developer docs](https://grafana.com/docs/grafana/latest/developers/plugins/)
-- [Plugin migration guide](https://grafana.com/docs/grafana/latest/developers/plugins/migration-guide/)
+- [Plugin migration guide](https://grafana.com/docs/grafana/latest/developers/plugins/migration-guide)
 
 **`@grafana/create-plugin`** works on macOS, Linux and Windows Subsystem for Linux (WSL).<br />
 If something doesn't work, please [file an issue](https://github.com/grafana/plugin-tools/issues/new).<br />

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@grafana/create-plugin",
-  "version": "1.11.0-canary.365.32f6dfa.0",
+  "version": "1.12.0",
   "main": "index.js",
   "repository": {
     "directory": "packages/create-plugin",
@@ -66,5 +66,5 @@
   "engines": {
     "node": ">=16"
   },
-  "gitHead": "32f6dfa03422d88dbfd076f5b2d4c309795d98a5"
+  "gitHead": "05bf90d24a46c8a5458aeeebed9327b5add8f35b"
 }

package/templates/_partials/distributing-your-plugin.md

@@ -14,7 +14,7 @@ Before signing a plugin for the first time please consult the Grafana [plugin si
 
 1. Create a [Grafana Cloud account](https://grafana.com/signup).
 2. Make sure that the first part of the plugin ID matches the slug of your Grafana Cloud account.
-   - _You can find the plugin ID in the plugin.json file inside your plugin directory. For example, if your account slug is `acmecorp`, you need to prefix the plugin ID with `acmecorp-`._
+   - _You can find the plugin ID in the `plugin.json` file inside your plugin directory. For example, if your account slug is `acmecorp`, you need to prefix the plugin ID with `acmecorp-`._
 3. Create a Grafana Cloud API key with the `PluginPublisher` role.
 4. Keep a record of this API key as it will be required for signing a plugin
 

package/templates/app/README.md

@@ -18,5 +18,5 @@ App plugins can let you create a custom out-of-the-box monitoring experience by
 Below you can find source code for existing app plugins and other related documentation.
 
 - [Basic app plugin example](https://github.com/grafana/grafana-plugin-examples/tree/master/examples/app-basic#readme)
-- [Plugin.json documentation](https://grafana.com/docs/grafana/latest/developers/plugins/metadata/)
+- [`plugin.json` documentation](https://grafana.com/developers/plugin-tools/reference-plugin-json)
 - [How to sign a plugin?](https://grafana.com/docs/grafana/latest/developers/plugins/sign-a-plugin/)

package/templates/common/.config/webpack/utils.ts

@@ -1,9 +1,28 @@
 import fs from 'fs';
+import process from 'process';
+import os from 'os';
 import path from 'path';
 import util from 'util';
 import { glob } from 'glob';
 import { SOURCE_DIR } from './constants';
 
+
+export function isWSL() {
+  if (process.platform !== 'linux') {
+    return false;
+  }
+
+  if (os.release().toLowerCase().includes('microsoft')) {
+    return true;
+  }
+
+  try {
+    return fs.readFileSync('/proc/version', 'utf8').toLowerCase().includes('microsoft');
+  } catch {
+    return false;
+  }
+} 
+
 export function getPackageJson() {
   return require(path.resolve(process.cwd(), 'package.json'));
 }

package/templates/common/.config/webpack/webpack.config.ts

@@ -13,189 +13,201 @@ import path from 'path';
 import ReplaceInFileWebpackPlugin from 'replace-in-file-webpack-plugin';
 import { Configuration } from 'webpack';
 
-import { getPackageJson, getPluginJson, hasReadme, getEntries } from './utils';
+import { getPackageJson, getPluginJson, hasReadme, getEntries, isWSL } from './utils';
 import { SOURCE_DIR, DIST_DIR } from './constants';
 
 const pluginJson = getPluginJson();
 
-const config = async (env): Promise<Configuration> => ({
-  cache: {
-    type: 'filesystem',
-    buildDependencies: {
-      config: [__filename],
-    },
-  },
-
-  context: path.join(process.cwd(), SOURCE_DIR),
-
-  devtool: env.production ? 'source-map' : 'eval-source-map',
-
-  entry: await getEntries(),
-
-  externals: [
-    'lodash',
-    'jquery',
-    'moment',
-    'slate',
-    'emotion',
-    '@emotion/react',
-    '@emotion/css',
-    'prismjs',
-    'slate-plain-serializer',
-    '@grafana/slate-react',
-    'react',
-    'react-dom',
-    'react-redux',
-    'redux',
-    'rxjs',
-    'react-router',
-    'react-router-dom',
-    'd3',
-    'angular',
-    '@grafana/ui',
-    '@grafana/runtime',
-    '@grafana/data',
-
-    // Mark legacy SDK imports as external if their name starts with the "grafana/" prefix
-    ({ request }, callback) => {
-      const prefix = 'grafana/';
-      const hasPrefix = (request) => request.indexOf(prefix) === 0;
-      const stripPrefix = (request) => request.substr(prefix.length);
-
-      if (hasPrefix(request)) {
-        return callback(undefined, stripPrefix(request));
-      }
-
-      callback();
+const config = async (env): Promise<Configuration> => {
+  const baseConfig: Configuration = {
+    cache: {
+      type: 'filesystem',
+      buildDependencies: {
+        config: [__filename],
+      },
     },
-  ],
-
-  mode: env.production ? 'production' : 'development',
-
-  module: {
-    rules: [
-      {
-        exclude: /(node_modules)/,
-        test: /\.[tj]sx?$/,
-        use: {
-          loader: 'swc-loader',
-          options: {
-            jsc: {
-              baseUrl: './src',
-              target: 'es2015',
-              loose: false,
-              parser: {
-                syntax: 'typescript',
-                tsx: true,
-                decorators: false,
-                dynamicImport: true,
+
+    context: path.join(process.cwd(), SOURCE_DIR),
+
+    devtool: env.production ? 'source-map' : 'eval-source-map',
+
+    entry: await getEntries(),
+
+    externals: [
+      'lodash',
+      'jquery',
+      'moment',
+      'slate',
+      'emotion',
+      '@emotion/react',
+      '@emotion/css',
+      'prismjs',
+      'slate-plain-serializer',
+      '@grafana/slate-react',
+      'react',
+      'react-dom',
+      'react-redux',
+      'redux',
+      'rxjs',
+      'react-router',
+      'react-router-dom',
+      'd3',
+      'angular',
+      '@grafana/ui',
+      '@grafana/runtime',
+      '@grafana/data',
+
+      // Mark legacy SDK imports as external if their name starts with the "grafana/" prefix
+      ({ request }, callback) => {
+        const prefix = 'grafana/';
+        const hasPrefix = (request) => request.indexOf(prefix) === 0;
+        const stripPrefix = (request) => request.substr(prefix.length);
+
+        if (hasPrefix(request)) {
+          return callback(undefined, stripPrefix(request));
+        }
+
+        callback();
+      },
+    ],
+
+    mode: env.production ? 'production' : 'development',
+
+    module: {
+      rules: [
+        {
+          exclude: /(node_modules)/,
+          test: /\.[tj]sx?$/,
+          use: {
+            loader: 'swc-loader',
+            options: {
+              jsc: {
+                baseUrl: './src',
+                target: 'es2015',
+                loose: false,
+                parser: {
+                  syntax: 'typescript',
+                  tsx: true,
+                  decorators: false,
+                  dynamicImport: true,
+                },
               },
             },
           },
         },
+        {
+          test: /\.css$/,
+          use: ["style-loader", "css-loader"]
+        },
+        {
+          test: /\.s[ac]ss$/,
+          use: ['style-loader', 'css-loader', 'sass-loader'],
+        },
+        {
+          test: /\.(png|jpe?g|gif|svg)$/,
+          type: 'asset/resource',
+          generator: {
+            // Keep publicPath relative for host.com/grafana/ deployments
+            publicPath: `public/plugins/${pluginJson.id}/img/`,
+            outputPath: 'img/',
+            filename: Boolean(env.production) ? '[hash][ext]' : '[name][ext]',
+          },
+        },
+        {
+          test: /\.(woff|woff2|eot|ttf|otf)(\?v=\d+\.\d+\.\d+)?$/,
+          type: 'asset/resource',
+          generator: {
+            // Keep publicPath relative for host.com/grafana/ deployments
+            publicPath: `public/plugins/${pluginJson.id}/fonts/`,
+            outputPath: 'fonts/',
+            filename: Boolean(env.production) ? '[hash][ext]' : '[name][ext]',
+          },
+        },
+      ],
+    },
+
+    output: {
+      clean: {
+        keep: new RegExp(`(.*?_(amd64|arm(64)?)(.exe)?|go_plugin_build_manifest)`),
       },
-      {
-        test: /\.css$/,
-        use: ["style-loader", "css-loader"]
-      },
-      {
-        test: /\.s[ac]ss$/,
-        use: ['style-loader', 'css-loader', 'sass-loader'],
+      filename: '[name].js',
+      library: {
+        type: 'amd',
       },
-      {
-        test: /\.(png|jpe?g|gif|svg)$/,
-        type: 'asset/resource',
-        generator: {
-          // Keep publicPath relative for host.com/grafana/ deployments
-          publicPath: `public/plugins/${pluginJson.id}/img/`,
-          outputPath: 'img/',
-          filename: Boolean(env.production) ? '[hash][ext]' : '[name][ext]',
+      path: path.resolve(process.cwd(), DIST_DIR),
+      publicPath: '/',
+    },
+
+    plugins: [
+      new CopyWebpackPlugin({
+        patterns: [
+          // If src/README.md exists use it; otherwise the root README
+          // To `compiler.options.output`
+          { from: hasReadme() ? 'README.md' : '../README.md', to: '.', force: true },
+          { from: 'plugin.json', to: '.' },
+          { from: '../LICENSE', to: '.' },
+          { from: '../CHANGELOG.md', to: '.', force: true },
+          { from: '**/*.json', to: '.' }, // TODO<Add an error for checking the basic structure of the repo>
+          { from: '**/*.svg', to: '.', noErrorOnMissing: true }, // Optional
+          { from: '**/*.png', to: '.', noErrorOnMissing: true }, // Optional
+          { from: '**/*.html', to: '.', noErrorOnMissing: true }, // Optional
+          { from: 'img/**/*', to: '.', noErrorOnMissing: true }, // Optional
+          { from: 'libs/**/*', to: '.', noErrorOnMissing: true }, // Optional
+          { from: 'static/**/*', to: '.', noErrorOnMissing: true }, // Optional
+        ],
+      }),
+      // Replace certain template-variables in the README and plugin.json
+      new ReplaceInFileWebpackPlugin([
+        {
+          dir: DIST_DIR,
+          files: ['plugin.json', 'README.md'],
+          rules: [
+            {
+              search: /\%VERSION\%/g,
+              replace: getPackageJson().version,
+            },
+            {
+              search: /\%TODAY\%/g,
+              replace: new Date().toISOString().substring(0, 10),
+            },
+            {
+              search: /\%PLUGIN_ID\%/g,
+              replace: pluginJson.id,
+            },
+          ],
         },
-      },
-      {
-        test: /\.(woff|woff2|eot|ttf|otf)(\?v=\d+\.\d+\.\d+)?$/,
-        type: 'asset/resource',
-        generator: {
-          // Keep publicPath relative for host.com/grafana/ deployments
-          publicPath: `public/plugins/${pluginJson.id}/fonts/`,
-          outputPath: 'fonts/',
-          filename: Boolean(env.production) ? '[hash][ext]' : '[name][ext]',
+      ]),
+      new ForkTsCheckerWebpackPlugin({
+        async: Boolean(env.development),
+        issue: {
+          include: [{ file: '**/*.{ts,tsx}' }],
         },
-      },
+        typescript: { configFile: path.join(process.cwd(), 'tsconfig.json') },
+      }),
+      new ESLintPlugin({
+        extensions: ['.ts', '.tsx'],
+        lintDirtyModulesOnly: Boolean(env.development), // don't lint on start, only lint changed files
+      }),
+      ...(env.development ? [new LiveReloadPlugin()] : []),
     ],
-  },
 
-  output: {
-    clean: {
-      keep: new RegExp(`(.*?_(amd64|arm(64)?)(.exe)?|go_plugin_build_manifest)`),
-    },
-    filename: '[name].js',
-    library: {
-      type: 'amd',
+    resolve: {
+      extensions: ['.js', '.jsx', '.ts', '.tsx'],
+      // handle resolving "rootDir" paths
+      modules: [path.resolve(process.cwd(), 'src'), 'node_modules'],
+      unsafeCache: true,
     },
-    path: path.resolve(process.cwd(), DIST_DIR),
-    publicPath: '/',
-  },
-
-  plugins: [
-    new CopyWebpackPlugin({
-      patterns: [
-        // If src/README.md exists use it; otherwise the root README
-        // To `compiler.options.output`
-        { from: hasReadme() ? 'README.md' : '../README.md', to: '.', force: true },
-        { from: 'plugin.json', to: '.' },
-        { from: '../LICENSE', to: '.' },
-        { from: '../CHANGELOG.md', to: '.', force: true },
-        { from: '**/*.json', to: '.' }, // TODO<Add an error for checking the basic structure of the repo>
-        { from: '**/*.svg', to: '.', noErrorOnMissing: true }, // Optional
-        { from: '**/*.png', to: '.', noErrorOnMissing: true }, // Optional
-        { from: '**/*.html', to: '.', noErrorOnMissing: true }, // Optional
-        { from: 'img/**/*', to: '.', noErrorOnMissing: true }, // Optional
-        { from: 'libs/**/*', to: '.', noErrorOnMissing: true }, // Optional
-        { from: 'static/**/*', to: '.', noErrorOnMissing: true }, // Optional
-      ],
-    }),
-    // Replace certain template-variables in the README and plugin.json
-    new ReplaceInFileWebpackPlugin([
-      {
-        dir: DIST_DIR,
-        files: ['plugin.json', 'README.md'],
-        rules: [
-          {
-            search: /\%VERSION\%/g,
-            replace: getPackageJson().version,
-          },
-          {
-            search: /\%TODAY\%/g,
-            replace: new Date().toISOString().substring(0, 10),
-          },
-          {
-            search: /\%PLUGIN_ID\%/g,
-            replace: pluginJson.id,
-          },
-        ],
-      },
-    ]),
-    new ForkTsCheckerWebpackPlugin({
-      async: Boolean(env.development),
-      issue: {
-        include: [{ file: '**/*.{ts,tsx}' }],
-      },
-      typescript: { configFile: path.join(process.cwd(), 'tsconfig.json') },
-    }),
-    new ESLintPlugin({
-      extensions: ['.ts', '.tsx'],
-      lintDirtyModulesOnly: Boolean(env.development), // don't lint on start, only lint changed files
-    }),
-    ...(env.development ? [new LiveReloadPlugin()] : []),
-  ],
-
-  resolve: {
-    extensions: ['.js', '.jsx', '.ts', '.tsx'],
-    // handle resolving "rootDir" paths
-    modules: [path.resolve(process.cwd(), 'src'), 'node_modules'],
-    unsafeCache: true,
-  },
-});
+  }
+
+  if(isWSL()) {
+    baseConfig.watchOptions = {
+      poll: 3000,
+      ignored: /node_modules/,
+    }}
+
+
+  return baseConfig;
+
+};
 
 export default config;

package/templates/datasource/README.md

@@ -18,5 +18,5 @@ Grafana supports a wide range of data sources, including Prometheus, MySQL, and
 Below you can find source code for existing app plugins and other related documentation.
 
 - [Basic data source plugin example](https://github.com/grafana/grafana-plugin-examples/tree/master/examples/datasource-basic#readme)
-- [Plugin.json documentation](https://grafana.com/docs/grafana/latest/developers/plugins/metadata/)
+- [`plugin.json` documentation](https://grafana.com/developers/plugin-tools/reference-plugin-json)
 - [How to sign a plugin?](https://grafana.com/docs/grafana/latest/developers/plugins/sign-a-plugin/)

package/templates/panel/README.md

@@ -19,5 +19,5 @@ Use panel plugins when you want to do things like visualize data returned by dat
 Below you can find source code for existing app plugins and other related documentation.
 
 - [Basic panel plugin example](https://github.com/grafana/grafana-plugin-examples/tree/master/examples/panel-basic#readme)
-- [Plugin.json documentation](https://grafana.com/docs/grafana/latest/developers/plugins/metadata/)
+- [`plugin.json` documentation](https://grafana.com/developers/plugin-tools/reference-plugin-json)
 - [How to sign a plugin?](https://grafana.com/docs/grafana/latest/developers/plugins/sign-a-plugin/)