fix import proxies (JSON, CSS, etc) from npm packages

snowpack/src/commands/dev.ts

@@ -480,12 +480,16 @@ export async function startDevServer(commandOptions: CommandOptions): Promise<Sn
     if (reqPath.startsWith(config.buildOptions.webModulesUrl)) {
       try {
         const webModuleUrl = reqPath.substr(config.buildOptions.webModulesUrl.length + 1);
-        const response = await pkgSource.load(webModuleUrl, commandOptions);
+        const loadedModule = await pkgSource.load(webModuleUrl, commandOptions);
+        let code = loadedModule;
+        if (isProxyModule) {
+          code = await wrapImportProxy({url: reqPath, code: code.toString(), hmr: isHMR, config});
+        }
         return {
-          contents: encodeResponse(response, encoding),
+          contents: encodeResponse(code, encoding),
           originalFileLoc: null,
-          contentType: path.extname(reqPath)
-            ? mime.lookup(path.extname(reqPath))
+          contentType: path.extname(originalReqPath)
+            ? mime.lookup(path.extname(originalReqPath))
             : 'application/javascript',
         };
       } catch (err) {

test/build/import-json/import-json.test.js

@@ -0,0 +1,39 @@
+const path = require('path');
+const {setupBuildTest, readFiles} = require('../../test-utils');
+
+const STRIP_WHITESPACE = /((\s+$)|((\\r\\n)|(\\n)))/gm;
+const cwd = path.join(__dirname, 'build');
+let files = {};
+
+describe('import-json', () => {
+  beforeAll(() => {
+    setupBuildTest(__dirname);
+    files = readFiles(
+      [
+        '_dist_/index.js',
+        '_dist_/file.json.proxy.js',
+        'web_modules/json-test-pkg/file.json.proxy.js',
+      ],
+      {
+        cwd,
+      },
+    );
+  });
+
+  it('imports in source file are transformed correctly', () => {
+    expect(files['/_dist_/index.js'].replace(STRIP_WHITESPACE, '')).toEqual(`import testJsonData from './file.json.proxy.js';
+import testJsonPkgData from '../web_modules/json-test-pkg/file.json.proxy.js';
+console.log('loaded:', testJsonData, testJsonPkgData);`);
+  });
+
+  it('local json file is built as expected', () => {
+    expect(files['/_dist_/file.json.proxy.js'].replace(STRIP_WHITESPACE, '')).toEqual(`let json = {"test":true};
+export default json;`);
+  });
+
+  it('npm package json file is imported as expected', () => {
+    expect(files['/web_modules/json-test-pkg/file.json.proxy.js'].replace(STRIP_WHITESPACE, ''))
+      .toEqual(`let json = {"test-json-pkg":true};
+export default json;`);
+  });
+});

test/build/import-json/package.json

@@ -0,0 +1,16 @@
+{
+  "private": true,
+  "version": "1.0.1",
+  "name": "@snowpack/test-import-json",
+  "description": "A test to make sure that JSON imports are working properly",
+  "scripts": {
+    "start": "snowpack dev",
+    "testbuild": "snowpack build"
+  },
+  "dependencies": {
+    "json-test-pkg": "file:./packages/json-test-pkg"
+  },
+  "devDependencies": {
+    "snowpack": "^2.14.3"
+  }
+}

test/build/import-json/packages/json-test-pkg/file.json

@@ -0,0 +1 @@
+{"test-json-pkg": true}

test/build/import-json/packages/json-test-pkg/package.json

@@ -0,0 +1,4 @@
+{
+  "name": "test-json-pkg",
+  "version": "0.1.0"
+}

test/build/import-json/snowpack.config.json

@@ -0,0 +1,5 @@
+{
+  "mount": {
+    "./src": "/_dist_"
+  }
+}

test/build/import-json/src/file.json

@@ -0,0 +1 @@
+{"test": true}

test/build/import-json/src/index.js

@@ -0,0 +1,3 @@
+import testJsonData from './file.json';
+import testJsonPkgData from 'json-test-pkg/file.json';
+console.log('loaded:', testJsonData, testJsonPkgData);

yarn.lock

@@ -8991,6 +8991,9 @@ json-stringify-safe@^5.0.1, json-stringify-safe@~5.0.1:
   resolved "https://registry.yarnpkg.com/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz#1296a2d58fd45f19a0f6ce01d65701e2c735b6eb"
   integrity sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus=
 
+"json-test-pkg@file:./test/build/import-json/packages/json-test-pkg":
+  version "0.1.0"
+
 json5@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/json5/-/json5-1.0.1.tgz#779fb0018604fa854eacbf6252180d83543e3dbe"