diff --git a/packages/gatsby-plugin-typescript/src/__tests__/gatsby-node.js b/packages/gatsby-plugin-typescript/src/__tests__/gatsby-node.js index c6197e776d78c..c10200d3d0e27 100644 --- a/packages/gatsby-plugin-typescript/src/__tests__/gatsby-node.js +++ b/packages/gatsby-plugin-typescript/src/__tests__/gatsby-node.js @@ -15,11 +15,12 @@ describe(`gatsby-plugin-typescript`, () => { }) it(`modifies webpack config`, () => { + const babelConfig = { "plugins":[``] } const config = { loader: jest.fn(), } - modifyWebpackConfig({ config }, { compilerOptions: {} }) + modifyWebpackConfig({ config, babelConfig }, { compilerOptions: {} }) expect(config.loader).toHaveBeenCalledTimes(1) const lastCall = config.loader.mock.calls.pop() @@ -27,12 +28,13 @@ describe(`gatsby-plugin-typescript`, () => { }) it(`passes the configuration to the ts-loader plugin`, () => { + const babelConfig = { "plugins":[``] } const config = { loader: jest.fn(), } const options = { compilerOptions: { foo: `bar` }, transpileOnly: false } - modifyWebpackConfig({ config }, options) + modifyWebpackConfig({ config, babelConfig }, options) const expectedOptions = { compilerOptions: { @@ -55,10 +57,11 @@ describe(`gatsby-plugin-typescript`, () => { }) it(`uses default configuration for the ts-loader plugin when no config is provided`, () => { + const babelConfig = { "plugins":[``] } const config = { loader: jest.fn(), } - modifyWebpackConfig({ config }, { compilerOptions: {} }) + modifyWebpackConfig({ config, babelConfig }, { compilerOptions: {} }) const expectedOptions = { compilerOptions: { diff --git a/packages/gatsby-plugin-typescript/src/gatsby-node.js b/packages/gatsby-plugin-typescript/src/gatsby-node.js index 52fe33f56db8e..c30fa7a3de286 100644 --- a/packages/gatsby-plugin-typescript/src/gatsby-node.js +++ b/packages/gatsby-plugin-typescript/src/gatsby-node.js @@ -1,5 +1,4 @@ const { transpileModule } = require(`typescript`) -const path = require(`path`) const test = /\.tsx?$/ const compilerDefaults = { @@ -11,7 +10,7 @@ const compilerDefaults = { module.exports.resolvableExtensions = () => [`.ts`, `.tsx`] module.exports.modifyWebpackConfig = ( - { config }, + { config, babelConfig }, { compilerOptions, transpileOnly = true } ) => { // CommonJS to keep Webpack happy. @@ -23,16 +22,10 @@ module.exports.modifyWebpackConfig = ( // error (i.e., not build) at something or other. const opts = { compilerOptions: copts, transpileOnly } - // Load gatsby babel plugin to extract graphql query - const extractQueryPlugin = path.resolve( - __dirname, - `../gatsby/dist/utils/babel-plugin-extract-graphql.js` - ) - config.loader(`typescript`, { test, loaders: [ - `babel?${JSON.stringify({ plugins: [extractQueryPlugin] })}`, + `babel?${JSON.stringify(babelConfig)}`, `ts-loader?${JSON.stringify(opts)}`, ], }) diff --git a/packages/gatsby/src/commands/build-javascript.js b/packages/gatsby/src/commands/build-javascript.js index 842d52ca31a91..9d7bb440fa075 100644 --- a/packages/gatsby/src/commands/build-javascript.js +++ b/packages/gatsby/src/commands/build-javascript.js @@ -11,7 +11,20 @@ module.exports = async program => { `build-javascript` ) - return new Promise(resolve => { - webpack(compilerConfig.resolve()).run(() => resolve()) + return new Promise((resolve, reject) => { + webpack(compilerConfig.resolve()).run((err, stats) => { + if (err) { + reject(err) + return + } + + const jsonStats = stats.toJson() + if (jsonStats.errors && jsonStats.errors.length > 0) { + reject(jsonStats.errors[0]) + return + } + + resolve() + }) }) } diff --git a/packages/gatsby/src/utils/webpack-modify-validate.js b/packages/gatsby/src/utils/webpack-modify-validate.js index 4e3c64da5cc9c..39e666d39ae73 100644 --- a/packages/gatsby/src/utils/webpack-modify-validate.js +++ b/packages/gatsby/src/utils/webpack-modify-validate.js @@ -17,9 +17,9 @@ const validationWhitelist = Joi.object({ responsiveLoader: Joi.any(), }) -export default (async function ValidateWebpackConfig(config, stage) { +export default (async function ValidateWebpackConfig(program, config, babelConfig, stage) { // We don't care about the return as plugins just mutate the config directly. - await apiRunnerNode(`modifyWebpackConfig`, { config, stage }) + await apiRunnerNode(`modifyWebpackConfig`, { program, config, babelConfig, stage }) // console.log(JSON.stringify(config, null, 4)) diff --git a/packages/gatsby/src/utils/webpack.config.js b/packages/gatsby/src/utils/webpack.config.js index 491da2f9a7b54..5307583da72cf 100644 --- a/packages/gatsby/src/utils/webpack.config.js +++ b/packages/gatsby/src/utils/webpack.config.js @@ -37,13 +37,12 @@ module.exports = async ( webpackPort = 1500, pages = [] ) => { - const babelStage = suppliedStage const directoryPath = withBasePath(directory) // We combine develop & develop-html stages for purposes of generating the // webpack config. const stage = suppliedStage - const babelConfig = await genBabelConfig(program, babelStage) + const babelConfig = await genBabelConfig(program, suppliedStage) function processEnv(stage, defaultNodeEnv) { debug(`Building env for "${stage}"`) @@ -556,7 +555,7 @@ module.exports = async ( // Use the suppliedStage again to let plugins distinguish between // server rendering the html.js and the frontend development config. - const validatedConfig = await webpackModifyValidate(config, suppliedStage) + const validatedConfig = await webpackModifyValidate(program, config, babelConfig, suppliedStage) return validatedConfig }