fix: respect 'use strict' (#77)

webpack-contrib · Jun 17, 2020 · c7f8799 · c7f8799
1 parent 9e2cec4
commit c7f8799
Show file tree

Hide file tree

Showing 9 changed files with 189 additions and 31 deletions.
diff --git a/README.md b/README.md
@@ -486,6 +486,8 @@ import $ from 'jquery';
 }.call(window, document));
 ```
 
+> ⚠ Do not use this option if source code contains ES module import(s)
+
 ### additionalCode
 
 Type: `String`
@@ -507,7 +509,7 @@ module.exports = {
                 moduleName: 'jquery',
                 name: '$',
               },
-              additionalCode: 'var someVariable = 1;',
+              additionalCode: 'var define = false;',
             },
           },
         ],
@@ -522,7 +524,7 @@ Generate output:
 ```js
 import $ from 'jquery';
 
-var someVariable = 1;
+var define = false;
 
 // ...
 // Code

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -43,7 +43,8 @@
   "dependencies": {
     "loader-utils": "^2.0.0",
     "schema-utils": "^2.7.0",
-    "source-map": "^0.6.1"
+    "source-map": "^0.6.1",
+    "strip-comments": "^2.0.1"
   },
   "devDependencies": {
     "@babel/cli": "^7.10.1",

diff --git a/src/index.js b/src/index.js
@@ -9,7 +9,7 @@ import validateOptions from 'schema-utils';
 
 import schema from './options.json';
 
-import { getImports, renderImports } from './utils';
+import { getImports, renderImports, sourceHasUseStrict } from './utils';
 
 const HEADER = '/*** IMPORTS FROM imports-loader ***/\n';
 
@@ -37,10 +37,13 @@ export default function loader(content, sourceMap) {
       return;
     }
 
+    // We don't need to remove 'use strict' manually, because `terser` do it
+    const directive = sourceHasUseStrict(content);
+
     importsCode += Object.entries(imports).reduce(
       (accumulator, item) =>
         `${accumulator}${renderImports(this, type, item[0], item[1])}\n`,
-      ''
+      directive ? "'use strict';\n" : ''
     );
   }
 

diff --git a/src/utils.js b/src/utils.js
@@ -1,4 +1,17 @@
 import { stringifyRequest } from 'loader-utils';
+import strip from 'strip-comments';
+
+function forError(item) {
+  return typeof item === 'string'
+    ? item
+    : `\n${JSON.stringify(item, null, ' ')}\n`;
+}
+
+function sourceHasUseStrict(source) {
+  const str = strip(source).trim();
+
+  return str.startsWith("'use strict'") || str.startsWith('"use strict"');
+}
 
 function resolveImports(type, item) {
   const defaultSyntax = type === 'module' ? 'default' : 'single';
@@ -50,11 +63,7 @@ function resolveImports(type, item) {
     throw new Error(
       `The "${result.syntax}" syntax does not support "${
         result.alias
-      }" alias in "${
-        typeof item === 'string'
-          ? item
-          : `\n${JSON.stringify(item, null, ' ')}\n`
-      }" value`
+      }" alias in "${forError(item)}" value`
     );
   }
 
@@ -65,11 +74,7 @@ function resolveImports(type, item) {
     throw new Error(
       `The "${result.syntax}" syntax does not support "${
         result.name
-      }" name in "${
-        typeof item === 'string'
-          ? item
-          : `\n${JSON.stringify(item, null, ' ')}\n`
-      }" value`
+      }" name in "${forError(item)}" value`
     );
   }
 
@@ -78,11 +83,9 @@ function resolveImports(type, item) {
     type === 'commonjs'
   ) {
     throw new Error(
-      `The "${type}" type does not support the "${result.syntax}" syntax in "${
-        typeof item === 'string'
-          ? item
-          : `\n${JSON.stringify(item, null, ' ')}\n`
-      }" value`
+      `The "${type}" type does not support the "${
+        result.syntax
+      }" syntax in "${forError(item)}" value`
     );
   }
 
@@ -93,11 +96,7 @@ function resolveImports(type, item) {
     throw new Error(
       `The "${type}" format does not support the "${
         result.syntax
-      }" syntax in "${
-        typeof item === 'string'
-          ? item
-          : `\n${JSON.stringify(item, null, ' ')}\n`
-      }" value`
+      }" syntax in "${forError(item)}" value`
     );
   }
 
@@ -106,11 +105,9 @@ function resolveImports(type, item) {
     typeof result.name === 'undefined'
   ) {
     throw new Error(
-      `The "${result.syntax}" syntax needs the "name" option in "${
-        typeof item === 'string'
-          ? item
-          : `\n${JSON.stringify(item, null, ' ')}\n`
-      }" value`
+      `The "${result.syntax}" syntax needs the "name" option in "${forError(
+        item
+      )}" value`
     );
   }
 
@@ -315,4 +312,4 @@ function renderImports(loaderContext, type, moduleName, imports) {
   return code;
 }
 
-export { getImports, renderImports };
+export { sourceHasUseStrict, getImports, renderImports };
diff --git a/test/__snapshots__/loader.test.js.snap b/test/__snapshots__/loader.test.js.snap
@@ -649,6 +649,88 @@ var someCode = {
 
 exports[`loader should work with "single" imports without syntax: warnings 1`] = `Array []`;
 
+exports[`loader should work with "use-strict" not in program with CommonJS modules: errors 1`] = `Array []`;
+
+exports[`loader should work with "use-strict" not in program with CommonJS modules: module 1`] = `
+"/*** IMPORTS FROM imports-loader ***/
+var lib_1 = require(\\"lib_1\\");
+
+var myObject = { foo: 'bar' };
+
+function test() {
+  'use strict';
+
+  return 'test';
+}
+"
+`;
+
+exports[`loader should work with "use-strict" not in program with CommonJS modules: warnings 1`] = `Array []`;
+
+exports[`loader should work with "use-strict" not in program with ES modules: errors 1`] = `Array []`;
+
+exports[`loader should work with "use-strict" not in program with ES modules: module 1`] = `
+"/*** IMPORTS FROM imports-loader ***/
+import lib_1 from \\"lib_1\\";
+
+var myObject = { foo: 'bar' };
+
+function test() {
+  'use strict';
+
+  return 'test';
+}
+"
+`;
+
+exports[`loader should work with "use-strict" not in program with ES modules: warnings 1`] = `Array []`;
+
+exports[`loader should work with "use-strict" with CommonJS modules: errors 1`] = `Array []`;
+
+exports[`loader should work with "use-strict" with CommonJS modules: module 1`] = `
+"/*** IMPORTS FROM imports-loader ***/
+'use strict';
+var lib_1 = require(\\"lib_1\\");
+
+/* Comment */
+
+'use strict';
+
+var myObject = { foo: 'bar' };
+
+function test() {
+  'use strict';
+
+  return 'test';
+}
+"
+`;
+
+exports[`loader should work with "use-strict" with CommonJS modules: warnings 1`] = `Array []`;
+
+exports[`loader should work with "use-strict" with ES modules: errors 1`] = `Array []`;
+
+exports[`loader should work with "use-strict" with ES modules: module 1`] = `
+"/*** IMPORTS FROM imports-loader ***/
+'use strict';
+import lib_1 from \\"lib_1\\";
+
+/* Comment */
+
+'use strict';
+
+var myObject = { foo: 'bar' };
+
+function test() {
+  'use strict';
+
+  return 'test';
+}
+"
+`;
+
+exports[`loader should work with "use-strict" with ES modules: warnings 1`] = `Array []`;
+
 exports[`loader should work with a string syntax using CommonJS: errors 1`] = `Array []`;
 
 exports[`loader should work with a string syntax using CommonJS: module 1`] = `

diff --git a/test/fixtures/use-strict-in-function.js b/test/fixtures/use-strict-in-function.js
@@ -0,0 +1,7 @@
+var myObject = { foo: 'bar' };
+
+function test() {
+  'use strict';
+
+  return 'test';
+}
diff --git a/test/fixtures/use-strict.js b/test/fixtures/use-strict.js
@@ -0,0 +1,11 @@
+/* Comment */
+
+'use strict';
+
+var myObject = { foo: 'bar' };
+
+function test() {
+  'use strict';
+
+  return 'test';
+}
diff --git a/test/loader.test.js b/test/loader.test.js
@@ -149,6 +149,56 @@ describe('loader', () => {
     expect(getWarnings(stats)).toMatchSnapshot('warnings');
   });
 
+  it('should work with "use-strict" with ES modules', async () => {
+    const compiler = getCompiler('use-strict.js', {
+      imports: 'lib_1',
+    });
+    const stats = await compile(compiler);
+
+    expect(getModuleSource('./use-strict.js', stats)).toMatchSnapshot('module');
+    expect(getErrors(stats)).toMatchSnapshot('errors');
+    expect(getWarnings(stats)).toMatchSnapshot('warnings');
+  });
+
+  it('should work with "use-strict" with CommonJS modules', async () => {
+    const compiler = getCompiler('use-strict.js', {
+      type: 'commonjs',
+      imports: 'lib_1',
+    });
+    const stats = await compile(compiler);
+
+    expect(getModuleSource('./use-strict.js', stats)).toMatchSnapshot('module');
+    expect(getErrors(stats)).toMatchSnapshot('errors');
+    expect(getWarnings(stats)).toMatchSnapshot('warnings');
+  });
+
+  it('should work with "use-strict" not in program with ES modules', async () => {
+    const compiler = getCompiler('use-strict-in-function.js', {
+      imports: 'lib_1',
+    });
+    const stats = await compile(compiler);
+
+    expect(
+      getModuleSource('./use-strict-in-function.js', stats)
+    ).toMatchSnapshot('module');
+    expect(getErrors(stats)).toMatchSnapshot('errors');
+    expect(getWarnings(stats)).toMatchSnapshot('warnings');
+  });
+
+  it('should work with "use-strict" not in program with CommonJS modules', async () => {
+    const compiler = getCompiler('use-strict-in-function.js', {
+      type: 'commonjs',
+      imports: 'lib_1',
+    });
+    const stats = await compile(compiler);
+
+    expect(
+      getModuleSource('./use-strict-in-function.js', stats)
+    ).toMatchSnapshot('module');
+    expect(getErrors(stats)).toMatchSnapshot('errors');
+    expect(getWarnings(stats)).toMatchSnapshot('warnings');
+  });
+
   it('should work with "imports", "wrapper" and "additionalCode" options', async () => {
     const compiler = getCompiler('some-library.js', {
       imports: {