1

I am trying to re-export an icon module which has 100+ svg icons in it which looks something like this:

This is a JavaScript file, would this cause the error below?

// This file is automatically generated
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });

var check = {
  name: 'check',
  data: '<svg>...</svg>'
}
exports.check = check

I then want to re-export that from my components module which I do like this:

export * as IconsModel from '@org/styles/icons/icon.model';

Then to use it I want to use it like this:

import { IconsModel as icons } from '@org/components/icons';

In my editor I get no errors, but when the code is built using webpack, I get the following error so I am not sure if the syntax is valid or not. If not what would be the correct syntax otherwise do I need an additional loader?

Module parse failed: Unexpected token (5:7)
File was processed with these loaders:
 * ./node_modules/@skyux-sdk/istanbul-instrumenter-loader/dist/index.js
 * ./node_modules/@storybook/angular/node_modules/ts-loader/index.js
 * ./node_modules/@storybook/angular/dist/ts3.9/server/ngx-template-loader/index.js
You may need an additional loader to handle the result of these loaders.
> export*as IconsModel from'@org/styles/icons/icon.model';
 @ ./stories/components/accordion/accordion.stories.ts 16:0-70 37:36-47
 @ ./stories sync ^\.(?:(?:^|\/|(?:(?:(?!(?:^|\/)\.).)*?)\/)(?!\.)(?=.)[^/]*?\.stories\.(js|jsx|ts|tsx))$
 @ ./generated-stories-entry.js
 @ multi ./node_modules/@storybook/core-client/dist/esm/globals/polyfills.js
Get Off My Lawn
  • 34,175
  • 38
  • 176
  • 338
  • What is your Node version? `export * as ...` is only available from 13.2.0 (according to [MDN](https://developer.mozilla.org/en-US/docs/web/javascript/reference/statements/export#browser_compatibility)) – Phil Sep 01 '22 at 02:28
  • @Phil I am using ts 4.x and node 14.x. maybe the ts-loader is the wrong version? The answers above are for typescript the error regards webpack. I don't think this is a duplicate... – Get Off My Lawn Sep 01 '22 at 02:42
  • One of the answers links to a [Webpack issue](https://github.com/webpack/webpack/issues/10460) which also links to some related Angular issues. What version of Webpack are you using? – Phil Sep 01 '22 at 02:49
  • _"This is a JavaScript file"_... why does the error message list `accordion.stories.ts` then? – Phil Sep 01 '22 at 02:51
  • @Phil that automatically generated file is javascript the other files that include it are typescript. – Get Off My Lawn Sep 01 '22 at 12:45
  • 1
    changing `"module"` to `"es2015"` (or anything less than es2020) in the tsconfig fixed my issue. – Get Off My Lawn Sep 01 '22 at 15:08

0 Answers0