为什么在使用@ rollup / plugin-node-resolve时Typescript注释不起作用？

问题描述

我有一个简单的Angular项目，并且正在使用汇总创建工件。我的汇总看起来像这样...

// rollup.config.mjs

import typescript from "@rollup/plugin-typescript"
import resolve from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs'

export default {
    input: "index.mjs",output: [
        {
            file: getName("esm","mjs"),format: "esm"
        },{
            file: getName("umd","js"),format: "umd",name: "my-app"
        }
    ],plugins: [
        typescript(),commonjs({
            include: 'node_modules/**'
        }),resolve(),]
};

// tsconfig.json
{
  "compilerOptions": {
    "sourceMap": true,"target": "ESNext","experimentalDecorators": true,"moduleResolution": "Node","module": "ESNext"
  }
}

那我有一个简单的包装纸...

// index.mjs
import {Application} from "./Application.ts"

export {Application}

然后是我的Angular应用

//Application.ts
import {NgModule} from "@angular/core";

@NgModule()
export class Application{}

// TestComponent.ts
import {Component} from "@angular/core";
@Component({
    selector: "test-component",template: `
      <h1>This is the test component</h1>
    `
})
class TestComponent {

}

但是当我运行rollup -c rollup.config.mjs时，我得到了...。

1: import {NgModule} from "@angular/core";
2:
3: @NgModule(
   ^
4:
5: )
Error: Unexpected character '@' (Note that you need plugins to import files that are not JavaScript)
    at error (...\node_modules\rollup\dist\shared\rollup.js:213:30)

我如何汇总才能识别出这一点？如果我删除了plugin-node-resolve，一切似乎都可以正常工作（解决依赖关系除外）

我应该如何处理？

更新

这是编译后没有解析的最终文件...

import { NgModule } from '@angular/core';

/*! *****************************************************************************
copyright (c) Microsoft Corporation.

Permission to use,copy,modify,and/or distribute this software for any
purpose with or without fee is hereby granted.

THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR disCLAims ALL WARRANTIES WITH
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
AND fitness. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL,DIRECT,INDIRECT,OR CONSEQUENTIAL damAGES OR ANY damAGES WHATSOEVER RESULTING FROM
LOSS OF USE,DATA OR PROFITS,WHETHER IN AN ACTION OF CONTRACT,NEGLIGENCE OR
OTHER TORTIoUS ACTION,ARISING OUT OF OR IN CONNECTION WITH THE USE OR
PERFORMANCE OF THIS SOFTWARE.
***************************************************************************** */

function __decorate(decorators,target,key,desc) {
    var c = arguments.length,r = c < 3 ? target : desc === null ? desc = Object.getownPropertyDescriptor(target,key) : desc,d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators,desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target,r) : d(target,key)) || r;
    return c > 3 && r && Object.defineProperty(target,r),r;
}

let Application = class Application {
    hellowWorld() {
        console.log("Hello World");
    }
};
Application = __decorate([
    NgModule()
],Application);

export { Application };

但是这又不包括依赖项，我希望已包含所有dep的UMD捆绑包。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

angular rollup typescript typescript