Hi! I started referencing grafana-ui in my plugin. The plugin works but for some reason TypeScript compiler keeps throwing errors about code that should not even be compiled. How do I tell TS compiler not to compile grafana-ui components ?
Thanks!
-T
PS. I had to replace all @ in config with * for this post to go through.
TSCONFIG
TSCONFIG
{
“compileOnSave”: false,
“compilerOptions”: {
“target”: “es5”,
“module”: “esnext”,
“rootDir”: “./src”,
“baseUrl”: “./src”,
“jsx”: “react”,
“lib”: [ “es6”, “dom” ],
“declaration”: false,
“allowSyntheticDefaultImports”: true,
“esModuleInterop”: true,
//“forceConsistentCasingInFileNames”: true,
“importHelpers”: true,
“noEmitHelpers”: true,
“inlineSourceMap”: false,
“sourceMap”: true,
“noEmitOnError”: false,
“emitDecoratorMetadata”: false,
“experimentalDecorators”: true,
“noImplicitReturns”: true,
“noImplicitThis”: false,
“noImplicitUseStrict”: false,
“noImplicitAny”: false,
“noUnusedLocals”: true,
“strictNullChecks”: false,
“moduleResolution”: “node”,
“typeRoots”: [ “node_modules/*types”, “src/types” ],
“skipLibCheck”: true,
“preserveSymlinks”: true,
“downlevelIteration”: true,
“pretty”: false
}
}
WEBPACK.CONFIG
WEBPACK.CONFIG
const path = require(‘path’);
const webpack = require(‘webpack’);
const CopyWebpackPlugin = require(‘copy-webpack-plugin’);
const CleanWebpackPlugin = require(‘clean-webpack-plugin’);
module.exports = {
node: {
fs: ‘empty’,
},
context: path.join(__dirname, ‘src’),
entry: {
module: ‘./module.ts’,
},
devtool: ‘source-map’,
output: {
filename: ‘[name].js’,
path: path.join(__dirname, ‘dist’),
libraryTarget: ‘amd’,
},
externals: [
‘lodash’,
‘jquery’,
‘moment’,
‘slate’,
‘emotion’,
‘prismjs’,
‘slate-plain-serializer’,
‘slate-react’,
‘react’,
‘react-dom’,
‘react-redux’,
‘redux’,
‘rxjs’,
‘d3’,
‘angular’,
‘*grafana/ui’,
‘*grafana/runtime’,
‘*grafana/data’,
// *ts-ignore
function (context, request, callback) {
var prefix = ‘grafana/’;
if (request.indexOf(prefix) === 0) {
console.log(‘SKIP’, request);
return callback(null, request.substr(prefix.length));
}
if (request.indexOf('./lib/') === 0) {
console.log('SKIP', request);
return callback(null, request);
}
// *ts-ignore
callback();
},
],
plugins: [
new CleanWebpackPlugin(‘dist’, { allowExternal: true }),
new webpack.optimize.OccurrenceOrderPlugin(),
new CopyWebpackPlugin([
{ from: ‘plugin.json’, to: ‘.’ },
{ from: ‘…/README.md’, to: ‘.’ },
//{ from: ‘…/LICENSE’, to: ‘.’ },
{ from: ‘partials/', to: ‘.’ },
{ from: 'img/’, to: ‘.’ },
{ from: ‘css/', to: ‘.’ },
{ from: 'lib/’, to: ‘.’ },
]),
],
resolve: {
extensions: [‘.ts’, ‘.tsx’, ‘.js’],
},
module: {
rules: [
{
test: /.tsx?$/,
loaders: [
{
loader: ‘babel-loader’,
options: {
presets: [[‘*babel/preset-env’, { modules: false }]],
plugins: [‘angularjs-annotate’],
},
},
{
loader: ‘ts-loader’,
options: { onlyCompileBundledFiles: true },
},
],
exclude: /(node_modules)/,
},
{
test: /.css$/,
use: [
{
loader: ‘style-loader’,
},
{
loader: ‘css-loader’,
options: {
importLoaders: 1,
sourceMap: true,
},
},
],
},
],
},
};
