Commit 8bc4ef3e by Dominik Prokop Committed by Marcus Efraimsson

Revert "Babel: use babel-loader instead of ts-loader, ng-annotate with…

Revert "Babel: use babel-loader instead of ts-loader, ng-annotate with babel-plugin-angularjs-annotate (#21554)" (#21570)

This reverts #21554 which caused problems with e2e.
This reverts commit e7e0d18b.
parent c738a889
...@@ -9,13 +9,11 @@ ...@@ -9,13 +9,11 @@
"url": "http://github.com/grafana/grafana.git" "url": "http://github.com/grafana/grafana.git"
}, },
"devDependencies": { "devDependencies": {
"@babel/core": "7.8.3", "@babel/core": "7.6.4",
"@babel/plugin-proposal-nullish-coalescing-operator": "7.8.3", "@babel/plugin-syntax-dynamic-import": "7.2.0",
"@babel/plugin-proposal-optional-chaining": "7.8.3",
"@babel/plugin-syntax-dynamic-import": "7.8.3",
"@babel/preset-env": "7.6.3", "@babel/preset-env": "7.6.3",
"@babel/preset-react": "7.6.3", "@babel/preset-react": "7.6.3",
"@babel/preset-typescript": "7.8.3", "@babel/preset-typescript": "7.6.0",
"@emotion/core": "10.0.10", "@emotion/core": "10.0.10",
"@rtsao/plugin-proposal-class-properties": "7.0.1-patch.1", "@rtsao/plugin-proposal-class-properties": "7.0.1-patch.1",
"@testing-library/react-hooks": "^3.2.1", "@testing-library/react-hooks": "^3.2.1",
...@@ -107,6 +105,8 @@ ...@@ -107,6 +105,8 @@
"mocha": "4.1.0", "mocha": "4.1.0",
"module-alias": "2.2.0", "module-alias": "2.2.0",
"monaco-editor": "0.15.6", "monaco-editor": "0.15.6",
"ng-annotate-loader": "0.6.1",
"ng-annotate-webpack-plugin": "0.3.0",
"ngtemplate-loader": "2.0.1", "ngtemplate-loader": "2.0.1",
"node-sass": "4.12.0", "node-sass": "4.12.0",
"npm": "6.13.4", "npm": "6.13.4",
......
...@@ -6,6 +6,8 @@ import React, { PureComponent } from 'react'; ...@@ -6,6 +6,8 @@ import React, { PureComponent } from 'react';
// @ts-ignore // @ts-ignore
import { default as ReactSelect, Creatable } from '@torkelo/react-select'; import { default as ReactSelect, Creatable } from '@torkelo/react-select';
// @ts-ignore // @ts-ignore
import { Creatable } from '@torkelo/react-select/lib/creatable';
// @ts-ignore
import { default as ReactAsyncSelect } from '@torkelo/react-select/lib/Async'; import { default as ReactAsyncSelect } from '@torkelo/react-select/lib/Async';
// @ts-ignore // @ts-ignore
import { components } from '@torkelo/react-select'; import { components } from '@torkelo/react-select';
......
...@@ -27,99 +27,73 @@ module.exports = (env = {}) => ...@@ -27,99 +27,73 @@ module.exports = (env = {}) =>
}, },
module: { module: {
rules: [ rules: [{
test: /\.tsx?$/,
enforce: 'pre',
exclude: /node_modules/,
use: {
loader: 'tslint-loader',
options: {
emitErrors: true,
typeCheck: false,
}
}
},
{ {
test: /\.tsx?$/, test: /\.tsx?$/,
exclude: /node_modules/, exclude: /node_modules/,
use: [ use: {
{ loader: 'ts-loader',
loader: 'babel-loader', options: {
options: { transpileOnly: true
cacheDirectory: true,
babelrc: false,
// Note: order is top-to-bottom and/or left-to-right
plugins: [
[
require('@rtsao/plugin-proposal-class-properties'),
{
loose: true,
},
],
'@babel/plugin-proposal-nullish-coalescing-operator',
'@babel/plugin-proposal-optional-chaining',
'@babel/plugin-syntax-dynamic-import', // needed for `() => import()` in routes.ts
'angularjs-annotate',
],
// Note: order is bottom-to-top and/or right-to-left
presets: [
[
'@babel/preset-env',
{
targets: {
browsers: 'last 3 versions',
},
useBuiltIns: 'entry',
modules: false,
},
],
'@babel/preset-typescript',
'@babel/preset-react',
],
},
}, },
{ },
loader: 'tslint-loader',
options: {
emitErrors: true,
typeCheck: false,
},
},
],
}, },
require('./sass.rule.js')({ require('./sass.rule.js')({
sourceMap: false, sourceMap: false,
preserveUrl: false, preserveUrl: false
}), }),
{ {
test: /\.(png|jpg|gif|ttf|eot|svg|woff(2)?)(\?[a-z0-9=&.]+)?$/, test: /\.(png|jpg|gif|ttf|eot|svg|woff(2)?)(\?[a-z0-9=&.]+)?$/,
loader: 'file-loader', loader: 'file-loader'
}, },
], ]
}, },
plugins: [ plugins: [
new CleanWebpackPlugin(), new CleanWebpackPlugin(),
env.noTsCheck env.noTsCheck ?
? new webpack.DefinePlugin({}) // bogus plugin to satisfy webpack API new webpack.DefinePlugin({}) // bogus plugin to satisfy webpack API
: new ForkTsCheckerWebpackPlugin({ :
checkSyntacticErrors: true, new ForkTsCheckerWebpackPlugin({
}), checkSyntacticErrors: true,
}),
new MiniCssExtractPlugin({ new MiniCssExtractPlugin({
filename: 'grafana.[name].[hash].css', filename: 'grafana.[name].[hash].css'
}), }),
new HtmlWebpackPlugin({ new HtmlWebpackPlugin({
filename: path.resolve(__dirname, '../../public/views/error.html'), filename: path.resolve(__dirname, '../../public/views/error.html'),
template: path.resolve(__dirname, '../../public/views/error-template.html'), template: path.resolve(__dirname, '../../public/views/error-template.html'),
inject: false, inject: false,
chunksSortMode: 'none', chunksSortMode: 'none',
excludeChunks: ['dark', 'light'], excludeChunks: ['dark', 'light']
}), }),
new HtmlWebpackPlugin({ new HtmlWebpackPlugin({
filename: path.resolve(__dirname, '../../public/views/index.html'), filename: path.resolve(__dirname, '../../public/views/index.html'),
template: path.resolve(__dirname, '../../public/views/index-template.html'), template: path.resolve(__dirname, '../../public/views/index-template.html'),
inject: false, inject: false,
chunksSortMode: 'none', chunksSortMode: 'none',
excludeChunks: ['dark', 'light'], excludeChunks: ['dark', 'light']
}), }),
new webpack.NamedModulesPlugin(), new webpack.NamedModulesPlugin(),
new webpack.HotModuleReplacementPlugin(), new webpack.HotModuleReplacementPlugin(),
new webpack.DefinePlugin({ new webpack.DefinePlugin({
'process.env': { 'process.env': {
NODE_ENV: JSON.stringify('development'), NODE_ENV: JSON.stringify('development')
}, }
}), }),
// new BundleAnalyzerPlugin({ // new BundleAnalyzerPlugin({
// analyzerPort: 8889 // analyzerPort: 8889
// }) // })
], ]
}); });
...@@ -7,7 +7,7 @@ const webpack = require('webpack'); ...@@ -7,7 +7,7 @@ const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin'); const HtmlWebpackPlugin = require('html-webpack-plugin');
const HtmlWebpackHarddiskPlugin = require('html-webpack-harddisk-plugin'); const HtmlWebpackHarddiskPlugin = require('html-webpack-harddisk-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin'); const CleanWebpackPlugin = require('clean-webpack-plugin');
const IgnoreNotFoundExportPlugin = require('./IgnoreNotFoundExportPlugin.js'); const IgnoreNotFoundExportPlugin = require("./IgnoreNotFoundExportPlugin.js");
module.exports = merge(common, { module.exports = merge(common, {
mode: 'development', mode: 'development',
...@@ -36,56 +36,50 @@ module.exports = merge(common, { ...@@ -36,56 +36,50 @@ module.exports = merge(common, {
'!/public/build': 'http://localhost:3000', '!/public/build': 'http://localhost:3000',
}, },
watchOptions: { watchOptions: {
ignored: /node_modules/, ignored: /node_modules/
}, }
}, },
optimization: { optimization: {
removeAvailableModules: false, removeAvailableModules: false,
runtimeChunk: false, runtimeChunk: false,
removeEmptyChunks: false, removeEmptyChunks: false,
splitChunks: false, splitChunks: false
}, },
module: { module: {
rules: [ rules: [{
{
test: /\.tsx?$/, test: /\.tsx?$/,
exclude: /node_modules/, exclude: /node_modules/,
use: [ use: [{
{ loader: 'babel-loader',
loader: 'babel-loader', options: {
options: { cacheDirectory: true,
cacheDirectory: true, babelrc: false,
babelrc: false, plugins: [
plugins: [ [require('@rtsao/plugin-proposal-class-properties'), {
[ loose: true
require('@rtsao/plugin-proposal-class-properties'), }],
{ 'angularjs-annotate',
loose: true, '@babel/plugin-syntax-dynamic-import', // needed for `() => import()` in routes.ts
'react-hot-loader/babel',
],
presets: [
[
'@babel/preset-env',
{
targets: {
browsers: 'last 3 versions'
}, },
], useBuiltIns: 'entry',
'angularjs-annotate', modules: false
'@babel/plugin-syntax-dynamic-import', // needed for `() => import()` in routes.ts },
'react-hot-loader/babel',
], ],
presets: [ '@babel/preset-typescript',
[ '@babel/preset-react',
'@babel/preset-env', ],
{
targets: {
browsers: 'last 3 versions',
},
useBuiltIns: 'entry',
modules: false,
},
],
'@babel/preset-typescript',
'@babel/preset-react',
],
},
}, },
], }, ],
}, },
{ {
test: /\.scss$/, test: /\.scss$/,
...@@ -96,13 +90,13 @@ module.exports = merge(common, { ...@@ -96,13 +90,13 @@ module.exports = merge(common, {
loader: 'postcss-loader', loader: 'postcss-loader',
options: { options: {
config: { config: {
path: __dirname + '/postcss.config.js', path: __dirname + '/postcss.config.js'
}, },
}, },
}, },
{ {
loader: 'sass-loader', loader: 'sass-loader'
}, }
], ],
}, },
{ {
...@@ -119,7 +113,7 @@ module.exports = merge(common, { ...@@ -119,7 +113,7 @@ module.exports = merge(common, {
template: path.resolve(__dirname, '../../public/views/index-template.html'), template: path.resolve(__dirname, '../../public/views/index-template.html'),
inject: 'body', inject: 'body',
alwaysWriteToDisk: true, alwaysWriteToDisk: true,
chunksSortMode: 'none', chunksSortMode: 'none'
}), }),
new HtmlWebpackHarddiskPlugin(), new HtmlWebpackHarddiskPlugin(),
new webpack.NamedModulesPlugin(), new webpack.NamedModulesPlugin(),
......
...@@ -4,14 +4,15 @@ const merge = require('webpack-merge'); ...@@ -4,14 +4,15 @@ const merge = require('webpack-merge');
const TerserPlugin = require('terser-webpack-plugin'); const TerserPlugin = require('terser-webpack-plugin');
const common = require('./webpack.common.js'); const common = require('./webpack.common.js');
const path = require('path'); const path = require('path');
const ngAnnotatePlugin = require('ng-annotate-webpack-plugin');
const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin'); const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin'); const HtmlWebpackPlugin = require("html-webpack-plugin");
const MiniCssExtractPlugin = require('mini-css-extract-plugin'); const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin'); const OptimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin");
module.exports = merge(common, { module.exports = merge(common, {
mode: 'production', mode: 'production',
devtool: 'source-map', devtool: "source-map",
entry: { entry: {
dark: './public/sass/grafana.dark.scss', dark: './public/sass/grafana.dark.scss',
...@@ -19,61 +20,33 @@ module.exports = merge(common, { ...@@ -19,61 +20,33 @@ module.exports = merge(common, {
}, },
module: { module: {
// Note: order is bottom-to-top and/or right-to-left rules: [{
rules: [ test: /\.tsx?$/,
enforce: 'pre',
exclude: /node_modules/,
use: {
loader: 'tslint-loader',
options: {
emitErrors: true,
typeCheck: false,
}
}
},
{ {
test: /\.tsx?$/, test: /\.tsx?$/,
exclude: /node_modules/, exclude: /node_modules/,
use: [ use: {
{ loader: 'ts-loader',
loader: 'babel-loader', options: {
options: { transpileOnly: true
cacheDirectory: true,
babelrc: false,
// Note: order is top-to-bottom and/or left-to-right
plugins: [
[
require('@rtsao/plugin-proposal-class-properties'),
{
loose: true,
},
],
'@babel/plugin-proposal-nullish-coalescing-operator',
'@babel/plugin-proposal-optional-chaining',
'@babel/plugin-syntax-dynamic-import', // needed for `() => import()` in routes.ts
'angularjs-annotate',
],
// Note: order is bottom-to-top and/or right-to-left
presets: [
[
'@babel/preset-env',
{
targets: {
browsers: 'last 3 versions',
},
useBuiltIns: 'entry',
modules: false,
},
],
'@babel/preset-typescript',
'@babel/preset-react',
],
},
},
{
loader: 'tslint-loader',
options: {
emitErrors: true,
typeCheck: false,
},
}, },
], },
}, },
require('./sass.rule.js')({ require('./sass.rule.js')({
sourceMap: false, sourceMap: false,
preserveUrl: false, preserveUrl: false
}), })
], ]
}, },
optimization: { optimization: {
nodeEnv: 'production', nodeEnv: 'production',
...@@ -81,39 +54,40 @@ module.exports = merge(common, { ...@@ -81,39 +54,40 @@ module.exports = merge(common, {
new TerserPlugin({ new TerserPlugin({
cache: false, cache: false,
parallel: true, parallel: true,
sourceMap: true, sourceMap: true
}), }),
new OptimizeCSSAssetsPlugin({}), new OptimizeCSSAssetsPlugin({})
], ]
}, },
plugins: [ plugins: [
new ForkTsCheckerWebpackPlugin({ new ForkTsCheckerWebpackPlugin({
checkSyntacticErrors: true, checkSyntacticErrors: true,
}), }),
new MiniCssExtractPlugin({ new MiniCssExtractPlugin({
filename: 'grafana.[name].[hash].css', filename: "grafana.[name].[hash].css"
}), }),
new ngAnnotatePlugin(),
new HtmlWebpackPlugin({ new HtmlWebpackPlugin({
filename: path.resolve(__dirname, '../../public/views/error.html'), filename: path.resolve(__dirname, '../../public/views/error.html'),
template: path.resolve(__dirname, '../../public/views/error-template.html'), template: path.resolve(__dirname, '../../public/views/error-template.html'),
inject: false, inject: false,
excludeChunks: ['dark', 'light'], excludeChunks: ['dark', 'light'],
chunksSortMode: 'none', chunksSortMode: 'none'
}), }),
new HtmlWebpackPlugin({ new HtmlWebpackPlugin({
filename: path.resolve(__dirname, '../../public/views/index.html'), filename: path.resolve(__dirname, '../../public/views/index.html'),
template: path.resolve(__dirname, '../../public/views/index-template.html'), template: path.resolve(__dirname, '../../public/views/index-template.html'),
inject: false, inject: false,
excludeChunks: ['manifest', 'dark', 'light'], excludeChunks: ['manifest', 'dark', 'light'],
chunksSortMode: 'none', chunksSortMode: 'none'
}), }),
function() { function () {
this.hooks.done.tap('Done', function(stats) { this.hooks.done.tap('Done', function (stats) {
if (stats.compilation.errors && stats.compilation.errors.length) { if (stats.compilation.errors && stats.compilation.errors.length) {
console.log(stats.compilation.errors); console.log(stats.compilation.errors);
process.exit(1); process.exit(1);
} }
}); });
}, }
], ]
}); });
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment