Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Include extensions in preserveModules output filenames for scriptified assets #3116

Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
8 changes: 6 additions & 2 deletions docs/999-big-list-of-options.md
Expand Up @@ -416,11 +416,15 @@ Default: `"[name].js"`
The pattern to use for chunks created from entry points. Pattern supports the following placeholders:
* `[format]`: The rendering format defined in the output options, e.g. `esm` or `cjs`.
* `[hash]`: A hash based on the content of the entry point and the content of all its dependencies.
* `[name]`: The file name (without extension) of the entry point.
* `[name]`: The file name (without extension) of the entry point, unless the object form of input was used to define a different name.

Forward slashes `/` can be used to place files in sub-directories. See also [`output.assetFileNames`](guide/en/#outputassetfilenames), [`output.chunkFileNames`](guide/en/#outputchunkfilenames).

This pattern will also be used when using the [`preserveModules`](guide/en/#preservemodules) option. Note however that when preserving modules, hashes are not yet supported.
This pattern will also be used when using the [`preserveModules`](guide/en/#preservemodules) option. Here there is a different set of placeholders available, though:
* `[format]`: The rendering format defined in the output options.
* `[name]`: The file name (without extension) of the file.
* `[ext]`: The extension of the file.
* `[extname]`: The extension of the file, prefixed by `.` if it is not empty.

#### output.extend
Type: `boolean`<br>
Expand Down
16 changes: 12 additions & 4 deletions src/Chunk.ts
Expand Up @@ -30,7 +30,7 @@ import { error } from './utils/error';
import { sortByExecutionOrder } from './utils/executionOrder';
import getIndentString from './utils/getIndentString';
import { makeLegal } from './utils/identifierHelpers';
import { basename, dirname, isAbsolute, normalize, resolve } from './utils/path';
import { basename, dirname, extname, isAbsolute, normalize, resolve } from './utils/path';
import relativeId, { getAliasName } from './utils/relativeId';
import renderChunk from './utils/renderChunk';
import { RenderOptions } from './utils/renderHelpers';
Expand Down Expand Up @@ -83,6 +83,8 @@ interface FacadeName {
name?: string;
}

const NON_ASSET_EXTENSIONS = ['.js', '.jsx', '.ts', '.tsx'];

function getGlobalName(
module: ExternalModule,
globals: GlobalsOption,
Expand Down Expand Up @@ -280,14 +282,20 @@ export default class Chunk {
options: OutputOptions,
existingNames: Record<string, any>
): string {
const sanitizedId = sanitizeFileName(this.orderedModules[0].id);
const id = this.orderedModules[0].id;
const sanitizedId = sanitizeFileName(id);

let path: string;
if (isAbsolute(this.orderedModules[0].id)) {
if (isAbsolute(id)) {
const extension = extname(id);

const name = renderNamePattern(
options.entryFileNames || '[name].js',
options.entryFileNames ||
(NON_ASSET_EXTENSIONS.includes(extension) ? '[name].js' : '[name][extname].js'),
'output.entryFileNames',
{
ext: () => extension.substr(1),
extname: () => extension,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Would be nice to also have a test that directly uses the new pattern elements in entryFileNames. Could also be an extension of an existing test.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sure, gonna tweak it.

format: () => (options.format === 'es' ? 'esm' : (options.format as string)),
name: () => this.getChunkName()
}
Expand Down
Expand Up @@ -3,7 +3,7 @@ module.exports = {
options: {
input: 'src/main.ts',
output: {
entryFileNames: 'entry-[name]-[format].js'
entryFileNames: 'entry-[name]-[format]-[ext][extname].js'
},
preserveModules: true
}
Expand Down
@@ -0,0 +1,12 @@
define(['exports', './entry-foo-amd-ts.ts', './nested/entry-bar-amd-ts.ts', './nested/entry-baz-amd-ts.ts', './entry-no-ext-amd-'], function (exports, foo, bar, baz, noExt) { 'use strict';



exports.foo = foo.default;
exports.bar = bar.default;
exports.baz = baz.default;
exports.noExt = noExt.default;

Object.defineProperty(exports, '__esModule', { value: true });

});

This file was deleted.

@@ -0,0 +1,7 @@
define(['exports'], function (exports) { 'use strict';

var noExt = 'no-ext';

exports.default = noExt;

});
@@ -0,0 +1,15 @@
'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var foo = require('./entry-foo-cjs-ts.ts.js');
var bar = require('./nested/entry-bar-cjs-ts.ts.js');
var baz = require('./nested/entry-baz-cjs-ts.ts.js');
var noExt = require('./entry-no-ext-cjs-.js');



exports.foo = foo.default;
exports.bar = bar.default;
exports.baz = baz.default;
exports.noExt = noExt.default;

This file was deleted.

@@ -0,0 +1,5 @@
'use strict';

var noExt = 'no-ext';

exports.default = noExt;
@@ -0,0 +1,4 @@
export { default as foo } from './entry-foo-esm-ts.ts.js';
export { default as bar } from './nested/entry-bar-esm-ts.ts.js';
export { default as baz } from './nested/entry-baz-esm-ts.ts.js';
export { default as noExt } from './entry-no-ext-esm-.js';

This file was deleted.

@@ -0,0 +1,3 @@
var noExt = 'no-ext';

export default noExt;
@@ -1,4 +1,4 @@
System.register(['./entry-foo-system.js', './nested/entry-bar-system.js', './nested/entry-baz-system.js'], function (exports) {
System.register(['./entry-foo-system-ts.ts.js', './nested/entry-bar-system-ts.ts.js', './nested/entry-baz-system-ts.ts.js', './entry-no-ext-system-.js'], function (exports) {
'use strict';
return {
setters: [function (module) {
Expand All @@ -7,6 +7,8 @@ System.register(['./entry-foo-system.js', './nested/entry-bar-system.js', './nes
exports('bar', module.default);
}, function (module) {
exports('baz', module.default);
}, function (module) {
exports('noExt', module.default);
}],
execute: function () {

Expand Down
@@ -0,0 +1,10 @@
System.register([], function (exports) {
'use strict';
return {
execute: function () {

var noExt = exports('default', 'no-ext');

}
};
});
Expand Up @@ -4,3 +4,5 @@ export { default as foo } from './foo.ts';
export { default as bar } from './nested/bar.ts';
// @ts-ignore
export { default as baz } from './nested/baz.ts';
// @ts-ignore
export { default as noExt } from './no-ext';
@@ -0,0 +1 @@
export default 'no-ext'
@@ -0,0 +1,26 @@
const path = require('path');

module.exports = {
description: 'scriptified assets have extension in preserveModules output filename',
options: {
input: 'src/main.js',
preserveModules: true,
plugins: [
{
name: 'str-num-plugin',
transform(code, id) {
switch (path.extname(id)) {
case '.num':
return { code: `export default ${code.trim()}` };
case '.str':
return { code: `export default "${code.trim()}"` };
case '':
return { code: 'export default "COULDN\'T TRANSFORM"' };
default:
return null;
}
}
}
]
}
};
@@ -0,0 +1,7 @@
define(['exports'], function (exports) { 'use strict';

var answer = 42;

exports.default = answer;

});
@@ -0,0 +1,7 @@
define(['exports'], function (exports) { 'use strict';

var lorem = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.";

exports.default = lorem;

});
@@ -0,0 +1,11 @@
define(['exports', './answer.num', './lorem.str', './no-ext'], function (exports, answer, lorem, noExt) { 'use strict';



exports.answer = answer.default;
exports.lorem = lorem.default;
exports.noExt = noExt.default;

Object.defineProperty(exports, '__esModule', { value: true });

});
@@ -0,0 +1,7 @@
define(['exports'], function (exports) { 'use strict';

var noExt = "COULDN'T TRANSFORM";

exports.default = noExt;

});
@@ -0,0 +1,5 @@
'use strict';

var answer = 42;

exports.default = answer;
@@ -0,0 +1,5 @@
'use strict';

var lorem = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.";

exports.default = lorem;
@@ -0,0 +1,13 @@
'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var answer = require('./answer.num.js');
var lorem = require('./lorem.str.js');
var noExt = require('./no-ext.js');



exports.answer = answer.default;
exports.lorem = lorem.default;
exports.noExt = noExt.default;
@@ -0,0 +1,5 @@
'use strict';

var noExt = "COULDN'T TRANSFORM";

exports.default = noExt;
@@ -0,0 +1,3 @@
var answer = 42;

export default answer;

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

@@ -0,0 +1,3 @@
export { default as answer } from './answer.num.js';
export { default as lorem } from './lorem.str.js';
export { default as noExt } from './no-ext.js';
@@ -0,0 +1,3 @@
var noExt = "COULDN'T TRANSFORM";

export default noExt;
@@ -0,0 +1,10 @@
System.register([], function (exports) {
'use strict';
return {
execute: function () {

var answer = exports('default', 42);

}
};
});
@@ -0,0 +1,10 @@
System.register([], function (exports) {
'use strict';
return {
execute: function () {

var lorem = exports('default', "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.");

}
};
});
@@ -0,0 +1,17 @@
System.register(['./answer.num.js', './lorem.str.js', './no-ext.js'], function (exports) {
'use strict';
return {
setters: [function (module) {
exports('answer', module.default);
}, function (module) {
exports('lorem', module.default);
}, function (module) {
exports('noExt', module.default);
}],
execute: function () {



}
};
});
@@ -0,0 +1,10 @@
System.register([], function (exports) {
'use strict';
return {
execute: function () {

var noExt = exports('default', "COULDN'T TRANSFORM");

}
};
});
@@ -0,0 +1 @@
42
@@ -0,0 +1 @@
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
@@ -0,0 +1,3 @@
export { default as answer } from './answer.num';
export { default as lorem } from './lorem.str';
export { default as noExt } from './no-ext';
@@ -0,0 +1 @@
WHATEVER