Skip to content
This repository has been archived by the owner on Jun 17, 2024. It is now read-only.

Feature/es module rename and default #45

Merged
merged 6 commits into from
Jun 10, 2020
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.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 8 additions & 5 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -108,9 +108,10 @@ module.exports = {
};
```

#### Export as ES Module
ECMAScript Module mode can be utilized to leverage Webpack 4's code splitting/lazy loading and to gain the benefits of tree shaking. This can be used by setting
`exportAsESM` to `true` in the loader options.
#### Export as CommonJS
By default, `ejs-loader` generates JS modules that use the ES modules syntax. There are some cases in which using ES modules is beneficial, like in the case of [module concatenation](https://webpack.js.org/plugins/module-concatenation-plugin/) and [tree shaking](https://webpack.js.org/guides/tree-shaking/).

You can enable a CommonJS module syntax using:

Config example with Webpack 4+
``` js
Expand All @@ -121,8 +122,7 @@ module.exports = {
test: /\.ejs$/,
loader: 'ejs-loader',
options: {
variable: 'data',
exportAsESM: true
esModule: false
}
}
]
Expand Down Expand Up @@ -156,6 +156,9 @@ As a result, `renderedHtml` becomes a string `<h1><a href="http://example.com">E


## Release History
* 0.5.0 - Changed `exportAsESM` flag to `esModule` and enabled this behavior by default to be consistent with other webpack loaders.
* 0.4.1 - Add default object for options to prevent breakages when the webpack query object is null
* 0.4.0 - Add support for ESModules with the `exportAsESM` flag
* 0.3.5 - Fix dependency vulnerabilities.
* 0.3.3 - Fix dependency vulnerabilities.
* 0.3.0 - Allow passing template options via `ejsLoader` or via loader's `query`
Expand Down
42 changes: 20 additions & 22 deletions __tests__/index.test.js
Original file line number Diff line number Diff line change
@@ -1,25 +1,29 @@
const requireFromString = require('require-from-string');
const ejsLoader = require('../index.js');

describe('ejsLoader', function() {
it('returns template with applied parameters', function() {
describe('ejsLoader', () => {
const compileTemplate = (template, mockedLoaderContext = {}) => {
const mergedMockedLoaderContext = {
cacheable: null,
...mockedLoaderContext
};

return ejsLoader.call(mergedMockedLoaderContext, template);
}

it('returns template with applied parameters in CommonJS with "esModule" set to false', () => {
const compilerOptions = {
query: {
esModule: false
}
};
const template = '<div>Hello <%= world %>!</div>';
const params = { world: 'World' };
const compiled = requireFromString(ejsLoader(template));

const compiled = requireFromString(compileTemplate(template, compilerOptions));
expect(compiled(params)).toBe('<div>Hello World!</div>');
});

describe('ejsLoader with ESModules feature', () => {
const compileTemplate = (template, mockedLoaderContext = {}) => {
const mergedMockedLoaderContext = {
cacheable: null,
...mockedLoaderContext
};

return ejsLoader.call(mergedMockedLoaderContext, template);
}

describe('ejsLoader with "esModule" feature', () => {
const convertTemplateStringToFunction = (templateString) => {
const removeExportDefaultString = templateString.match(/export default (.*)/s)[1];
return new Function(`return ${removeExportDefaultString}`)();
Expand All @@ -32,8 +36,7 @@ describe('ejsLoader', function() {
};
const compilerOptions = {
query: {
variable: 'args',
exportAsESM: true
variable: 'args'
}
};
const compiled = convertTemplateStringToFunction(compileTemplate(template, compilerOptions));
Expand All @@ -42,14 +45,9 @@ describe('ejsLoader', function() {

it('throws error when options variable or query variable are undefined', () => {
const template = '<div>Hello <%= args.world %>!</div>';
const compilerOptions = {
query: {
exportAsESM: true
}
};

expect(() => {
compileTemplate(template, compilerOptions)
compileTemplate(template)
}).toThrowError();
});
})
Expand Down
11 changes: 6 additions & 5 deletions index.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,12 +6,13 @@ var loaderUtils = require('loader-utils');
module.exports = function (source) {
this.cacheable && this.cacheable();
var options = loaderUtils.getOptions(this) || {};
var useESModule = options.esModule !== false;

if (options.exportAsESM && !options.variable) {
if (useESModule && !options.variable) {
throw new Error(`
To support ES Modules, the 'variable' option must be passed to avoid 'with' statements
in the compiled template to be strict mode compatible.
Please see https://github.com/lodash/lodash/issues/3709#issuecomment-375898111
To support the 'esModule' option, the 'variable' option must be passed to avoid 'with' statements
in the compiled template to be strict mode compatible. Please see https://github.com/lodash/lodash/issues/3709#issuecomment-375898111.
To enable CommonJS, please set the 'esModule' option to false.
`);
}

Expand All @@ -23,7 +24,7 @@ module.exports = function (source) {
});

var template = lodashTemplate(source, lodashExtend({}, options));
return options.exportAsESM
return useESModule
? `export default ${template}`
: `module.exports = ${template}`;
};
2 changes: 1 addition & 1 deletion package-lock.json

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

2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "ejs-loader",
"version": "0.4.1",
"version": "0.5.0",
"description": "EJS (Underscore/LoDash Templates) loader for webpack",
"main": "index.js",
"repository": {
Expand Down