@grafana/create-plugin 1.10.1 → 1.11.0-canary.356.f817ba0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@grafana/create-plugin",
-  "version": "1.10.1",
+  "version": "1.11.0-canary.356.f817ba0.0",
   "main": "index.js",
   "repository": {
     "directory": "packages/create-plugin",
@@ -66,5 +66,5 @@
   "engines": {
     "node": ">=16"
   },
-  "gitHead": "2330d588297f26458aec10265cbd8a953d417489"
+  "gitHead": "f817ba059b7b5d2babe9b58bcde5c9d70e39c378"
 }

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;