Skip to content

Commit d187a7c

Browse files
iorateiorate
authored
Apply other loaders when updating files in watch mode (#1115)
* Apply other loaders when updating changed files * Use 'loadModule' instead of 'runLoaders' * add a stringify loader * Add a comment to updateFile * v7.0.5
1 parent 1b84fed commit d187a7c

File tree

24 files changed

+806
-15
lines changed

24 files changed

+806
-15
lines changed

‎CHANGELOG.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,8 @@
11
# Changelog
22

3+
## v7.0.5
4+
* [Apply other loaders when updating files in watch mode](https://github.com/TypeStrong/ts-loader/pull/1115) - thanks @iorate
5+
36
## v7.0.4
47
* [Ensure a separate webpack instance is created for different loader options](https://github.com/TypeStrong/ts-loader/pull/1104) - thanks @appzuka
58

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "ts-loader",
3-
"version": "7.0.4",
3+
"version": "7.0.5",
44
"description": "TypeScript loader for webpack",
55
"main": "index.js",
66
"types": "dist",

‎src/instances.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -283,7 +283,7 @@ export function initializeInstance(
283283
);
284284
loader._compiler.hooks.watchRun.tapAsync(
285285
'ts-loader',
286-
makeWatchRun(instance)
286+
makeWatchRun(instance, loader)
287287
);
288288
}
289289
} else {
@@ -345,7 +345,7 @@ export function initializeInstance(
345345
);
346346
loader._compiler.hooks.watchRun.tapAsync(
347347
'ts-loader',
348-
makeWatchRun(instance)
348+
makeWatchRun(instance, loader)
349349
);
350350
}
351351
}

‎src/stringify-loader.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
module.exports = (source: string) => JSON.stringify(source);

‎src/watch-run.ts

Lines changed: 54 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import * as path from 'path';
12
import * as webpack from 'webpack';
23

34
import * as constants from './constants';
@@ -8,12 +9,19 @@ import { readFile } from './utils';
89
/**
910
* Make function which will manually update changed files
1011
*/
11-
export function makeWatchRun(instance: TSInstance) {
12+
export function makeWatchRun(
13+
instance: TSInstance,
14+
loader: webpack.loader.LoaderContext
15+
) {
1216
// Called Before starting compilation after watch
1317
const lastTimes = new Map<string, number>();
1418
const startTime = 0;
1519

16-
return (compiler: webpack.Compiler, callback: () => void) => {
20+
// Save the loader index.
21+
const loaderIndex = loader.loaderIndex;
22+
23+
return (compiler: webpack.Compiler, callback: (err?: Error) => void) => {
24+
const promises = [];
1725
if (instance.loaderOptions.transpileOnly) {
1826
instance.reportTranspileErrors = true;
1927
} else {
@@ -27,7 +35,7 @@ export function makeWatchRun(instance: TSInstance) {
2735
}
2836

2937
lastTimes.set(filePath, date);
30-
updateFile(instance, filePath);
38+
promises.push(updateFile(instance, filePath, loader, loaderIndex));
3139
}
3240

3341
// On watch update add all known dts files expect the ones in node_modules
@@ -37,26 +45,60 @@ export function makeWatchRun(instance: TSInstance) {
3745
filePath.match(constants.dtsDtsxOrDtsDtsxMapRegex) !== null &&
3846
filePath.match(constants.nodeModules) === null
3947
) {
40-
updateFile(instance, filePath);
48+
promises.push(updateFile(instance, filePath, loader, loaderIndex));
4149
}
4250
}
4351
}
4452

4553
// Update all the watched files from solution builder
4654
if (instance.solutionBuilderHost) {
4755
for (const filePath of instance.solutionBuilderHost.watchedFiles.keys()) {
48-
updateFile(instance, filePath);
56+
promises.push(updateFile(instance, filePath, loader, loaderIndex));
4957
}
5058
}
5159

52-
callback();
60+
Promise.all(promises)
61+
.then(() => callback())
62+
.catch(err => callback(err));
5363
};
5464
}
5565

56-
function updateFile(instance: TSInstance, filePath: string) {
57-
updateFileWithText(
58-
instance,
59-
filePath,
60-
nFilePath => readFile(nFilePath) || ''
61-
);
66+
function updateFile(
67+
instance: TSInstance,
68+
filePath: string,
69+
loader: webpack.loader.LoaderContext,
70+
loaderIndex: number
71+
) {
72+
return new Promise<void>((resolve, reject) => {
73+
// When other loaders are specified after ts-loader
74+
// (e.g. `{ test: /\.ts$/, use: ['ts-loader', 'other-loader'] }`),
75+
// manually apply them to TypeScript files.
76+
// Otherwise, files not 'preprocessed' by them may cause complication errors (#1111).
77+
if (
78+
loaderIndex + 1 < loader.loaders.length &&
79+
instance.rootFileNames.has(path.normalize(filePath))
80+
) {
81+
let request = `!!${path.resolve(__dirname, 'stringify-loader.js')}!`;
82+
for (let i = loaderIndex + 1; i < loader.loaders.length; ++i) {
83+
request += loader.loaders[i].request + '!';
84+
}
85+
request += filePath;
86+
loader.loadModule(request, (err, source) => {
87+
if (err) {
88+
reject(err);
89+
} else {
90+
const text = JSON.parse(source);
91+
updateFileWithText(instance, filePath, () => text);
92+
resolve();
93+
}
94+
});
95+
} else {
96+
updateFileWithText(
97+
instance,
98+
filePath,
99+
nFilePath => readFile(nFilePath) || ''
100+
);
101+
resolve();
102+
}
103+
});
62104
}

‎test/comparison-tests/otherLoadersWatch/app.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
import { message } from './message';
2+
console.log(message);

‎test/comparison-tests/otherLoadersWatch/expectedOutput-3.8/bundle.js

Lines changed: 113 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,113 @@
1+
/******/ (function(modules) { // webpackBootstrap
2+
/******/ // The module cache
3+
/******/ var installedModules = {};
4+
/******/
5+
/******/ // The require function
6+
/******/ function __webpack_require__(moduleId) {
7+
/******/
8+
/******/ // Check if module is in cache
9+
/******/ if(installedModules[moduleId]) {
10+
/******/ return installedModules[moduleId].exports;
11+
/******/ }
12+
/******/ // Create a new module (and put it into the cache)
13+
/******/ var module = installedModules[moduleId] = {
14+
/******/ i: moduleId,
15+
/******/ l: false,
16+
/******/ exports: {}
17+
/******/ };
18+
/******/
19+
/******/ // Execute the module function
20+
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
21+
/******/
22+
/******/ // Flag the module as loaded
23+
/******/ module.l = true;
24+
/******/
25+
/******/ // Return the exports of the module
26+
/******/ return module.exports;
27+
/******/ }
28+
/******/
29+
/******/
30+
/******/ // expose the modules object (__webpack_modules__)
31+
/******/ __webpack_require__.m = modules;
32+
/******/
33+
/******/ // expose the module cache
34+
/******/ __webpack_require__.c = installedModules;
35+
/******/
36+
/******/ // define getter function for harmony exports
37+
/******/ __webpack_require__.d = function(exports, name, getter) {
38+
/******/ if(!__webpack_require__.o(exports, name)) {
39+
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
40+
/******/ }
41+
/******/ };
42+
/******/
43+
/******/ // define __esModule on exports
44+
/******/ __webpack_require__.r = function(exports) {
45+
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
46+
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
47+
/******/ }
48+
/******/ Object.defineProperty(exports, '__esModule', { value: true });
49+
/******/ };
50+
/******/
51+
/******/ // create a fake namespace object
52+
/******/ // mode & 1: value is a module id, require it
53+
/******/ // mode & 2: merge all properties of value into the ns
54+
/******/ // mode & 4: return value when already ns object
55+
/******/ // mode & 8|1: behave like require
56+
/******/ __webpack_require__.t = function(value, mode) {
57+
/******/ if(mode & 1) value = __webpack_require__(value);
58+
/******/ if(mode & 8) return value;
59+
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
60+
/******/ var ns = Object.create(null);
61+
/******/ __webpack_require__.r(ns);
62+
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
63+
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
64+
/******/ return ns;
65+
/******/ };
66+
/******/
67+
/******/ // getDefaultExport function for compatibility with non-harmony modules
68+
/******/ __webpack_require__.n = function(module) {
69+
/******/ var getter = module && module.__esModule ?
70+
/******/ function getDefault() { return module['default']; } :
71+
/******/ function getModuleExports() { return module; };
72+
/******/ __webpack_require__.d(getter, 'a', getter);
73+
/******/ return getter;
74+
/******/ };
75+
/******/
76+
/******/ // Object.prototype.hasOwnProperty.call
77+
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
78+
/******/
79+
/******/ // __webpack_public_path__
80+
/******/ __webpack_require__.p = "";
81+
/******/
82+
/******/
83+
/******/ // Load entry module and return exports
84+
/******/ return __webpack_require__(__webpack_require__.s = "./app.ts");
85+
/******/ })
86+
/************************************************************************/
87+
/******/ ({
88+
89+
/***/ "./app.ts":
90+
/*!****************!*\
91+
!*** ./app.ts ***!
92+
\****************/
93+
/*! no static exports found */
94+
/***/ (function(module, exports, __webpack_require__) {
95+
96+
"use strict";
97+
eval("\nexports.__esModule = true;\nvar message_1 = __webpack_require__(/*! ./message */ \"./message.ts\");\nconsole.log(message_1.message);\n\n\n//# sourceURL=webpack:///./app.ts?");
98+
99+
/***/ }),
100+
101+
/***/ "./message.ts":
102+
/*!********************!*\
103+
!*** ./message.ts ***!
104+
\********************/
105+
/*! no static exports found */
106+
/***/ (function(module, exports, __webpack_require__) {
107+
108+
"use strict";
109+
eval("\nexports.__esModule = true;\nexports.message = 'Hello, world!';\n\n\n//# sourceURL=webpack:///./message.ts?");
110+
111+
/***/ })
112+
113+
/******/ });

‎test/comparison-tests/otherLoadersWatch/expectedOutput-3.8/output.txt

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
Asset Size Chunks Chunk Names
2+
bundle.js 4.22 KiB main [emitted] main
3+
Entrypoint main = bundle.js
4+
[./app.ts] 111 bytes {main} [built]
5+
[./message.ts] 76 bytes {main} [built]

‎test/comparison-tests/otherLoadersWatch/expectedOutput-3.8/patch0/bundle.js

Lines changed: 113 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,113 @@
1+
/******/ (function(modules) { // webpackBootstrap
2+
/******/ // The module cache
3+
/******/ var installedModules = {};
4+
/******/
5+
/******/ // The require function
6+
/******/ function __webpack_require__(moduleId) {
7+
/******/
8+
/******/ // Check if module is in cache
9+
/******/ if(installedModules[moduleId]) {
10+
/******/ return installedModules[moduleId].exports;
11+
/******/ }
12+
/******/ // Create a new module (and put it into the cache)
13+
/******/ var module = installedModules[moduleId] = {
14+
/******/ i: moduleId,
15+
/******/ l: false,
16+
/******/ exports: {}
17+
/******/ };
18+
/******/
19+
/******/ // Execute the module function
20+
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
21+
/******/
22+
/******/ // Flag the module as loaded
23+
/******/ module.l = true;
24+
/******/
25+
/******/ // Return the exports of the module
26+
/******/ return module.exports;
27+
/******/ }
28+
/******/
29+
/******/
30+
/******/ // expose the modules object (__webpack_modules__)
31+
/******/ __webpack_require__.m = modules;
32+
/******/
33+
/******/ // expose the module cache
34+
/******/ __webpack_require__.c = installedModules;
35+
/******/
36+
/******/ // define getter function for harmony exports
37+
/******/ __webpack_require__.d = function(exports, name, getter) {
38+
/******/ if(!__webpack_require__.o(exports, name)) {
39+
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
40+
/******/ }
41+
/******/ };
42+
/******/
43+
/******/ // define __esModule on exports
44+
/******/ __webpack_require__.r = function(exports) {
45+
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
46+
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
47+
/******/ }
48+
/******/ Object.defineProperty(exports, '__esModule', { value: true });
49+
/******/ };
50+
/******/
51+
/******/ // create a fake namespace object
52+
/******/ // mode & 1: value is a module id, require it
53+
/******/ // mode & 2: merge all properties of value into the ns
54+
/******/ // mode & 4: return value when already ns object
55+
/******/ // mode & 8|1: behave like require
56+
/******/ __webpack_require__.t = function(value, mode) {
57+
/******/ if(mode & 1) value = __webpack_require__(value);
58+
/******/ if(mode & 8) return value;
59+
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
60+
/******/ var ns = Object.create(null);
61+
/******/ __webpack_require__.r(ns);
62+
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
63+
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
64+
/******/ return ns;
65+
/******/ };
66+
/******/
67+
/******/ // getDefaultExport function for compatibility with non-harmony modules
68+
/******/ __webpack_require__.n = function(module) {
69+
/******/ var getter = module && module.__esModule ?
70+
/******/ function getDefault() { return module['default']; } :
71+
/******/ function getModuleExports() { return module; };
72+
/******/ __webpack_require__.d(getter, 'a', getter);
73+
/******/ return getter;
74+
/******/ };
75+
/******/
76+
/******/ // Object.prototype.hasOwnProperty.call
77+
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
78+
/******/
79+
/******/ // __webpack_public_path__
80+
/******/ __webpack_require__.p = "";
81+
/******/
82+
/******/
83+
/******/ // Load entry module and return exports
84+
/******/ return __webpack_require__(__webpack_require__.s = "./app.ts");
85+
/******/ })
86+
/************************************************************************/
87+
/******/ ({
88+
89+
/***/ "./app.ts":
90+
/*!****************!*\
91+
!*** ./app.ts ***!
92+
\****************/
93+
/*! no static exports found */
94+
/***/ (function(module, exports, __webpack_require__) {
95+
96+
"use strict";
97+
eval("\nexports.__esModule = true;\nvar message_1 = __webpack_require__(/*! ./message */ \"./message.ts\");\nconsole.log(message_1.message);\n\n\n//# sourceURL=webpack:///./app.ts?");
98+
99+
/***/ }),
100+
101+
/***/ "./message.ts":
102+
/*!********************!*\
103+
!*** ./message.ts ***!
104+
\********************/
105+
/*! no static exports found */
106+
/***/ (function(module, exports, __webpack_require__) {
107+
108+
"use strict";
109+
eval("\nexports.__esModule = true;\nexports.message = 'Hello, world!';\n\n\n//# sourceURL=webpack:///./message.ts?");
110+
111+
/***/ })
112+
113+
/******/ });

‎test/comparison-tests/otherLoadersWatch/expectedOutput-3.8/patch0/output.txt

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
Asset Size Chunks Chunk Names
2+
bundle.js 4.22 KiB main [emitted] main
3+
Entrypoint main = bundle.js
4+
[./app.ts] 111 bytes {main} [built]
5+
[./message.ts] 76 bytes {main}

0 commit comments

Comments
 (0)