svelte-loader - npm Package Compare versions

Comparing version 2.7.0 to 2.8.0

CHANGELOG.md

 # svelte-loader changelog
 
+## 2.8.0
+
+* Deprecate `options.markup`, `options.style` and `options.script` in favour of `options.preprocess.*` ([#41](https://github.com/sveltejs/svelte-loader/issues/41))
+
 ## 2.7.0
@@ -4,0 +8,0 @@

index.js

@@ -66,2 +66,19 @@ const { basename, extname, posix, relative } = require('path');
 
+const warned = {};
+function deprecatePreprocessOptions(options) {
+	const preprocessOptions = {};
+
+	['markup', 'style', 'script'].forEach(kind => {
+		if (options[kind]) {
+			if (!warned[kind]) {
+				console.warn(`[svelte-loader] DEPRECATION: options.${kind} is now options.preprocess.${kind}`);
+				warned[kind] = true;
+			}
+			preprocessOptions[kind] = options[kind];
+		}
+	});
+
+	options.preprocess = options.preprocess || preprocessOptions;
+}
+
 module.exports = function(source, map) {
@@ -90,3 +107,6 @@ this.cacheable();
 
-	preprocess(source, options).then(processed => {
+	deprecatePreprocessOptions(options);
+	options.preprocess.filename = options.filename;
+
+	preprocess(source, options.preprocess).then(processed => {
 		let { js, css, ast } = normalize(compile(processed.toString(), options));
@@ -93,0 +113,0 @@

package.json

 {
   "name": "svelte-loader",
-  "version": "2.7.0",
+  "version": "2.8.0",
   "author": "Nico Rehwaldt <[e-mail]>",
@@ -5,0 +5,0 @@ "description": "A webpack loader for svelte",

README.md

@@ -14,2 +14,6 @@ # svelte-loader
   ...
+  resolve: {
+    // see below for an explanation
+    mainFields: ['svelte', 'browser', 'module', 'main']
+  },
   module: {
@@ -31,2 +35,6 @@ rules: [
 
+### resolve.mainFields
+
+Webpack's [`resolve.mainFields`](https://webpack.js.org/configuration/resolve/#resolve-mainfields) option determines which fields in package.json are used to resolve identifiers. If you're using Svelte components installed from npm, you should specify this option so that your app can use the original component source code, rather than consuming the already-compiled version (which is less efficient).
+
 ### Extracting CSS
@@ -33,0 +41,0 @@

test/loader.spec.js

@@ -17,3 +17,3 @@ /* global describe, it */
 	function testLoader(fileName, callback, query, version = 2) {
-		return (done) => {
+		return done => {
 			function cb() {
@@ -32,14 +32,17 @@ try {
 
-			const cacheableSpy = spy(function() {
-			});
+			const cacheableSpy = spy(function() {});
 
 			const callbackSpy = spy(cb);
 
-			loader.call({
-				cacheable: cacheableSpy,
-				async: () => callbackSpy,
-				resourcePath: fileName,
-				version,
-				query,
-			}, fileContents, null);
+			loader.call(
+				{
+					cacheable: cacheableSpy,
+					async: () => callbackSpy,
+					resourcePath: fileName,
+					version,
+					query
+				},
+				fileContents,
+				null
+			);
 
@@ -51,8 +54,8 @@ expect(cacheableSpy).to.have.been.called;
 	it(
-			'should compile',
-			testLoader('test/fixtures/good.html', function(err, code, map) {
-				expect(err).not.to.exist;
-				expect(code).to.exist;
-				expect(map).to.exist;
-			})
+		'should compile',
+		testLoader('test/fixtures/good.html', function(err, code, map) {
+			expect(err).not.to.exist;
+			expect(code).to.exist;
+			expect(map).to.exist;
+		})
 	);
@@ -75,4 +78,3 @@
 					                     ^
-					2: <button on:click='set({ count: count + 1 })'>+1</button>`
-					);
+					2: <button on:click='set({ count: count + 1 })'>+1</button>`);
 
@@ -101,4 +103,3 @@ expect(code).not.to.exist;
 					6:   };
-					7: </script>`
-					);
+					7: </script>`);
 
@@ -127,4 +128,3 @@ expect(code).not.to.exist;
 					7:     }
-					8:   };`
-					);
+					8:   };`);
 
@@ -139,26 +139,26 @@ expect(code).not.to.exist;
 		it(
-				'should keep imports / methods',
-				testLoader('test/fixtures/es2015.html', function(err, code, map) {
-					expect(err).not.to.exist;
+			'should keep imports / methods',
+			testLoader('test/fixtures/es2015.html', function(err, code, map) {
+				expect(err).not.to.exist;
 
-					expect(code).to.exist;
-					expect(map).to.exist;
+				expect(code).to.exist;
+				expect(map).to.exist;
 
-					// es2015 statements remain
-					expect(code).to.contain(`import { hello } from './utils';`);
-					expect(code).to.contain('data() {');
-				})
+				// es2015 statements remain
+				expect(code).to.contain(`import { hello } from './utils';`);
+				expect(code).to.contain('data() {');
+			})
 		);
 
 		it(
-				'should keep nested Component import',
-				testLoader('test/fixtures/parent.html', function(err, code, map) {
-					expect(err).not.to.exist;
+			'should keep nested Component import',
+			testLoader('test/fixtures/parent.html', function(err, code, map) {
+				expect(err).not.to.exist;
 
-					// es2015 statements remain
-					expect(code).to.contain(`import Nested from './nested';`);
+				// es2015 statements remain
+				expect(code).to.contain(`import Nested from './nested';`);
 
-					expect(code).to.exist;
-					expect(map).to.exist;
-				})
+				expect(code).to.exist;
+				expect(map).to.exist;
+			})
 		);
@@ -170,19 +170,19 @@ });
 			it(
-					'should configure css (default)',
-					testLoader('test/fixtures/css.html', function(err, code, map) {
-						expect(err).not.to.exist;
-						expect(code).to.contain('function add_css()');
-					})
+				'should configure css (default)',
+				testLoader('test/fixtures/css.html', function(err, code, map) {
+					expect(err).not.to.exist;
+					expect(code).to.contain('function add_css()');
+				})
 			);
 
 			it(
-					'should configure no css',
-					testLoader(
-							'test/fixtures/css.html',
-							function(err, code, map) {
-								expect(err).not.to.exist;
-								expect(code).not.to.contain('function add_css()');
-							},
-							{ css: false }
-					)
+				'should configure no css',
+				testLoader(
+					'test/fixtures/css.html',
+					function(err, code, map) {
+						expect(err).not.to.exist;
+						expect(code).not.to.contain('function add_css()');
+					},
+					{ css: false }
+				)
 			);
@@ -193,28 +193,28 @@ });
 			it(
-					'should configure shared=false (default)',
-					testLoader(
-							'test/fixtures/good.html',
-							function(err, code, map) {
-								expect(err).not.to.exist;
+				'should configure shared=false (default)',
+				testLoader(
+					'test/fixtures/good.html',
+					function(err, code, map) {
+						expect(err).not.to.exist;
 
-								expect(code).not.to.contain('import {');
-								expect(code).not.to.contain('svelte/shared.js');
-							},
-							{},
-							1
-					)
+						expect(code).not.to.contain('import {');
+						expect(code).not.to.contain('svelte/shared.js');
+					},
+					{},
+					1
+				)
 			);
 
 			it(
-					'should configure shared=true',
-					testLoader(
-							'test/fixtures/good.html',
-							function(err, code, map) {
-								expect(err).not.to.exist;
+				'should configure shared=true',
+				testLoader(
+					'test/fixtures/good.html',
+					function(err, code, map) {
+						expect(err).not.to.exist;
 
-								expect(code).to.contain('import {');
-								expect(code).to.contain('svelte/shared.js');
-							},
-							{ shared: true }
-					)
+						expect(code).to.contain('import {');
+						expect(code).to.contain('svelte/shared.js');
+					},
+					{ shared: true }
+				)
 			);
@@ -225,26 +225,25 @@ });
 			it(
-					'should configure generate=undefined (default)',
-					testLoader('test/fixtures/good.html', function(err, code, map) {
-						expect(err).not.to.exist;
+				'should configure generate=undefined (default)',
+				testLoader('test/fixtures/good.html', function(err, code, map) {
+					expect(err).not.to.exist;
 
-						expect(code).
-								not.
-								to.
-								contain('.render = function(state, options = {}) {');
-					})
+					expect(code).not.to.contain(
+						'.render = function(state, options = {}) {'
+					);
+				})
 			);
 
 			it(
-					'should configure generate=ssr',
-					testLoader(
-							'test/fixtures/good.html',
-							function(err, code, map) {
-								expect(err).not.to.exist;
+				'should configure generate=ssr',
+				testLoader(
+					'test/fixtures/good.html',
+					function(err, code, map) {
+						expect(err).not.to.exist;
 
-								expect(code).
-										to.
-										contain('.render = function(state, options = {}) {');
-							},
-							{ generate: 'ssr' }
-					)
+						expect(code).to.contain(
+							'.render = function(state, options = {}) {'
+						);
+					},
+					{ generate: 'ssr' }
+				)
 			);
@@ -255,25 +254,25 @@ });
 			it(
-					'should configure emitCss=false (default)',
-					testLoader(
-							'test/fixtures/css.html',
-							function(err, code, map) {
-								expect(err).not.to.exist;
+				'should configure emitCss=false (default)',
+				testLoader(
+					'test/fixtures/css.html',
+					function(err, code, map) {
+						expect(err).not.to.exist;
 
-								expect(code).not.to.match(/require\('.+\.css'\);/);
-							},
-							{}
-					)
+						expect(code).not.to.match(/require\('.+\.css'\);/);
+					},
+					{}
+				)
 			);
 
 			it(
-					'should configure emitCss=true',
-					testLoader(
-							'test/fixtures/css.html',
-							function(err, code, map) {
-								expect(err).not.to.exist;
+				'should configure emitCss=true',
+				testLoader(
+					'test/fixtures/css.html',
+					function(err, code, map) {
+						expect(err).not.to.exist;
 
-								expect(code).to.match(/require\('.+\.css'\);/);
-							},
-							{ emitCss: true }
-					)
+						expect(code).to.match(/require\('.+\.css'\);/);
+					},
+					{ emitCss: true }
+				)
 			);
@@ -283,3 +282,3 @@ });
 		describe('preprocess', () => {
-			it('should preprocess successfully', (done) => {
+			it('should preprocess successfully', done => {
 				function callback(err, code, map) {
@@ -303,13 +302,16 @@ expect(err).not.to.exist;
 
-				const fileContents = readFileSync('test/fixtures/style-valid.html',
-						'utf-8');
-				const cacheableSpy = spy(() => {
-				});
+				const fileContents = readFileSync(
+					'test/fixtures/style-valid.html',
+					'utf-8'
+				);
+				const cacheableSpy = spy(() => {});
 				const callbackSpy = spy(cb);
 				const options = {
-					style: ({ content }) => {
-						return {
-							code: content.replace(/\$size/gi, '50px'),
-						};
-					},
+					preprocess: {
+						style: ({ content }) => {
+							return {
+								code: content.replace(/\$size/gi, '50px')
+							};
+						}
+					}
 				};
@@ -322,6 +324,6 @@
 						resourcePath: 'test/fixtures/style-valid.html',
-						options,
+						options
 					},
-						fileContents,
-						null
+					fileContents,
+					null
 				);
@@ -333,10 +335,13 @@
 			it('should not preprocess successfully', () => {
-				const fileContents = readFileSync('test/fixtures/style-valid.html',
-						'utf-8');
-				const cacheableSpy = spy(() => {
-				});
+				const fileContents = readFileSync(
+					'test/fixtures/style-valid.html',
+					'utf-8'
+				);
+				const cacheableSpy = spy(() => {});
 				const options = {
-					style: () => {
-						throw new Error('Error while preprocessing');
-					},
+					preprocess: {
+						style: () => {
+							throw new Error('Error while preprocessing');
+						}
+					}
 				};
@@ -347,12 +352,40 @@
 						cacheable: cacheableSpy,
-						async: () => (err) => {
+						async: () => err => {
 							expect(err).to.exist;
 						},
 						resourcePath: 'test/fixtures/style-valid.html',
-						options,
+						options
 					},
-						fileContents,
-						null
+					fileContents,
+					null
 				);
+			});
+		});
 
+		describe('deprecations', () => {
+			it('should warn on options.style', done => {
+				const { warn } = console;
+				const warnings = [];
+
+				console.warn = msg => {
+					warnings.push(msg);
+				};
+
+				testLoader(
+					'test/fixtures/style-valid.html',
+					(err, code, map) => {
+						expect(code).to.contain('50px');
+						expect(warnings).to.deep.equal([
+							'[svelte-loader] DEPRECATION: options.style is now options.preprocess.style'
+						]);
+						console.warn = warn;
+					},
+					{
+						style: ({ content }) => {
+							return {
+								code: content.replace(/\$size/gi, '50px')
+							};
+						}
+					}
+				)(done);
 			});
@@ -419,3 +452,3 @@ });
 						hotReload: true,
-						generate:'ssr'
+						generate: 'ssr'
 					}
@@ -422,0 +455,0 @@ )

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

86754

increased by2.81%

Number of package files

35

increased by2.94%

Lines of code

1588

increased by3.05%

Number of lines in readme file

205

increased by4.06%

No dependency changes