refactor: prepare for external typescript support (#5854)

packages/builder/src/builder.js

@@ -44,7 +44,7 @@ export default class Builder {
       restart: null
     }
 
-    this.supportedExtensions = ['vue', 'js', 'ts', 'tsx']
+    this.supportedExtensions = ['vue', 'js', 'ts', 'tsx', ...(this.options.build.additionalExtensions || [])]
 
     // Helper to resolve build paths
     this.relativeToBuild = (...args) => relativeTo(this.options.buildDir, ...args)
@@ -327,12 +327,11 @@ export default class Builder {
     consola.debug('Generating routes...')
 
     if (this._defaultPage) {
-      templateVars.router.routes = createRoutes(
-        ['index.vue'],
-        this.template.dir + '/pages',
-        '',
-        this.options.router.routeNameSplitter
-      )
+      templateVars.router.routes = createRoutes({
+        files: ['index.vue'],
+        srcDir: this.template.dir + '/pages',
+        routeNameSplitter: this.options.router.routeNameSplitter
+      })
     } else if (this._nuxtPages) {
       // Use nuxt.js createRoutes bases on pages/
       const files = {}
@@ -344,12 +343,13 @@ export default class Builder {
           files[key] = page.replace(/(['"])/g, '\\$1')
         }
       }
-      templateVars.router.routes = createRoutes(
-        Object.values(files),
-        this.options.srcDir,
-        this.options.dir.pages,
-        this.options.router.routeNameSplitter
-      )
+      templateVars.router.routes = createRoutes({
+        files: Object.values(files),
+        srcDir: this.options.srcDir,
+        pagesDir: this.options.dir.pages,
+        routeNameSplitter: this.options.router.routeNameSplitter,
+        supportedExtensions: this.supportedExtensions
+      })
     } else { // If user defined a custom method to create routes
       templateVars.router.routes = this.options.build.createRoutes(
         this.options.srcDir

packages/builder/test/builder.generate.test.js

@@ -564,7 +564,11 @@ describe('builder: builder generate', () => {
       expect(consola.debug).toBeCalledWith('Generating routes...')
       expect(nuxt.options.build.createRoutes).not.toBeCalled()
       expect(createRoutes).toBeCalledTimes(1)
-      expect(createRoutes).toBeCalledWith([ 'index.vue' ], '/var/nuxt/templates/pages', '', '[splitter]')
+      expect(createRoutes).toBeCalledWith({
+        files: [ 'index.vue' ],
+        srcDir: '/var/nuxt/templates/pages',
+        routeNameSplitter: '[splitter]'
+      })
       expect(nuxt.callHook).toBeCalledTimes(1)
       expect(nuxt.callHook).toBeCalledWith(
         'build:extendRoutes',
@@ -590,7 +594,7 @@ describe('builder: builder generate', () => {
         routeNameSplitter: '[splitter]',
         extendRoutes: jest.fn()
       }
-      createRoutes.mockImplementationOnce(files => files.map(file => ({ path: file })))
+      createRoutes.mockImplementationOnce(({ files }) => files.map(file => ({ path: file })))
       const builder = new Builder(nuxt, {})
       builder._nuxtPages = true
       builder.resolveFiles = jest.fn(dir => [
@@ -615,12 +619,13 @@ describe('builder: builder generate', () => {
       expect(builder.resolveFiles).toBeCalledWith('/var/nuxt/pages')
 
       expect(createRoutes).toBeCalledTimes(1)
-      expect(createRoutes).toBeCalledWith(
-        [ '/var/nuxt/pages/foo.vue', '/var/nuxt/pages/bar.vue', '/var/nuxt/pages/baz.vue' ],
-        '/var/nuxt/src',
-        '/var/nuxt/pages',
-        '[splitter]'
-      )
+      expect(createRoutes).toBeCalledWith({
+        files: [ '/var/nuxt/pages/foo.vue', '/var/nuxt/pages/bar.vue', '/var/nuxt/pages/baz.vue' ],
+        srcDir: '/var/nuxt/src',
+        pagesDir: '/var/nuxt/pages',
+        routeNameSplitter: '[splitter]',
+        supportedExtensions: ['vue', 'js', 'ts', 'tsx']
+      })
       expect(nuxt.callHook).toBeCalledTimes(1)
       expect(nuxt.callHook).toBeCalledWith(
         'build:extendRoutes',

packages/config/src/config/build.js

@@ -120,5 +120,7 @@ export default () => ({
       /vue-ssr-(client|modern)-manifest.json/
     ]
   },
-  friendlyErrors: true
+  friendlyErrors: true,
+  additionalExtensions: [],
+  warningIgnoreFilters: []
 })

packages/config/test/__snapshots__/options.test.js.snap

@@ -19,6 +19,7 @@ Object {
   "appTemplatePath": "/var/nuxt/test/.nuxt/views/app.template.html",
   "build": Object {
     "_publicPath": "/_nuxt/",
+    "additionalExtensions": Array [],
     "analyze": false,
     "babel": Object {
       "babelrc": false,
@@ -148,6 +149,7 @@ Object {
       "ignoreNotFoundWarnings": false,
       "typeCheck": true,
     },
+    "warningIgnoreFilters": Array [],
     "watch": Array [],
   },
   "buildDir": "/var/nuxt/test/.nuxt",

packages/config/test/config/__snapshots__/index.test.js.snap

@@ -6,6 +6,7 @@ Object {
   "_nuxtConfigFile": undefined,
   "alias": Object {},
   "build": Object {
+    "additionalExtensions": Array [],
     "analyze": false,
     "babel": Object {
       "babelrc": false,
@@ -128,6 +129,7 @@ Object {
       "ignoreNotFoundWarnings": false,
       "typeCheck": true,
     },
+    "warningIgnoreFilters": Array [],
     "watch": Array [],
   },
   "buildDir": ".nuxt",
@@ -340,6 +342,7 @@ Object {
   "_nuxtConfigFile": undefined,
   "alias": Object {},
   "build": Object {
+    "additionalExtensions": Array [],
     "analyze": false,
     "babel": Object {
       "babelrc": false,
@@ -462,6 +465,7 @@ Object {
       "ignoreNotFoundWarnings": false,
       "typeCheck": true,
     },
+    "warningIgnoreFilters": Array [],
     "watch": Array [],
   },
   "buildDir": ".nuxt",

packages/utils/src/route.js

@@ -131,8 +131,13 @@ const sortRoutes = function sortRoutes(routes) {
   return routes
 }
 
-export const createRoutes = function createRoutes(files, srcDir, pagesDir = '', routeNameSplitter = '-') {
-  const supportedExtensions = ['vue', 'js', 'ts', 'tsx']
+export const createRoutes = function createRoutes({
+  files,
+  srcDir,
+  pagesDir = '',
+  routeNameSplitter = '-',
+  supportedExtensions = ['vue', 'js', 'ts', 'tsx']
+}) {
   const routes = []
   files.forEach((file) => {
     const keys = file

packages/utils/test/route.test.js

@@ -186,12 +186,12 @@ describe('util: route', () => {
     const pagesDir = 'pages'
 
     test.posix('createRoutes should allow snake case routes in posix system', () => {
-      const routesResult = createRoutes(files, srcDir, pagesDir)
+      const routesResult = createRoutes({ files, srcDir, pagesDir })
       expect(routesResult).toMatchSnapshot()
     })
 
     test.win('createRoutes should allow snake case routes in windows system', () => {
-      const routesResult = createRoutes(files, srcDir, pagesDir)
+      const routesResult = createRoutes({ files, srcDir, pagesDir })
       expect(routesResult).toMatchSnapshot()
     })
   })

packages/webpack/src/config/base.js

@@ -14,7 +14,7 @@ import { isUrl, urlJoin } from '@nuxt/utils'
 
 import PerfLoader from '../utils/perf-loader'
 import StyleLoader from '../utils/style-loader'
-import WarnFixPlugin from '../plugins/warnfix'
+import WarningIgnorePlugin from '../plugins/warning-ignore'
 
 import { reservedVueTags } from '../utils/reserved-tags'
 
@@ -214,6 +214,7 @@ export default class WebpackBaseConfig {
       this.buildContext,
       { isServer: this.isServer, perfLoader }
     )
+
     const babelLoader = {
       loader: require.resolve('babel-loader'),
       options: this.getBabelOptions()
@@ -371,7 +372,7 @@ export default class WebpackBaseConfig {
 
     plugins.push(...(buildOptions.plugins || []))
 
-    plugins.push(new WarnFixPlugin(this.warningFixFilter()))
+    plugins.push(new WarningIgnorePlugin(this.warningIgnoreFilter()))
 
     // Build progress indicator
     plugins.push(new WebpackBar({
@@ -420,13 +421,14 @@ export default class WebpackBaseConfig {
     return plugins
   }
 
-  warningFixFilter() {
+  warningIgnoreFilter() {
     const { buildOptions, options: { _typescript = {} } } = this.buildContext
     const filters = [
       // Hide warnings about plugins without a default export (#1179)
       warn => warn.name === 'ModuleDependencyWarning' &&
         warn.message.includes(`export 'default'`) &&
-        warn.message.includes('nuxt_plugin_')
+        warn.message.includes('nuxt_plugin_'),
+      ...(buildOptions.warningIgnoreFilters || [])
     ]
 
     if (_typescript.build && buildOptions.typescript && buildOptions.typescript.ignoreNotFoundWarnings) {

packages/webpack/src/plugins/warning-ignore.js

@@ -1,4 +1,4 @@
-export default class WarnFixPlugin {
+export default class WarningIgnorePlugin {
   constructor(filter) {
     this.filter = filter
   }

test/unit/typescript-build.test.js

@@ -16,13 +16,13 @@ const createWebpackBaseConfig = (typescriptBuild, ignoreNotFoundWarnings) => {
   return new WebpackBaseConfig(builder)
 }
 
-describe('warningFixFilter', () => {
+describe('warningIgnoreFilter', () => {
   let filters
   const name = 'ModuleDependencyWarning'
 
   describe('disabled ignoreNotFoundWarnings', () => {
     beforeEach(() => {
-      filters = createWebpackBaseConfig(true, false).warningFixFilter()
+      filters = createWebpackBaseConfig(true, false).warningIgnoreFilter()
     })
 
     test('should be true', () => expect(filters({})).toBe(true))
@@ -33,7 +33,7 @@ describe('warningFixFilter', () => {
 
   describe('enabled ignoreNotFoundWarnings', () => {
     beforeEach(() => {
-      filters = createWebpackBaseConfig(true, true).warningFixFilter()
+      filters = createWebpackBaseConfig(true, true).warningIgnoreFilter()
     })
 
     test('should be true', () => expect(filters({})).toBe(true))