Systemjs and tsc setup - *.ts.js 404 (Not Found) Error

Systemjs and tsc setup - *.ts.js 404 (Not Found) Error

本文关键字:Not Found Error js ts tsc and setup Systemjs      更新时间:2023-09-26

我只是想用最少的设置创建一个概念验证的TS + SystemJS项目-没有"Angular2入门工具包"之类的。我花了一个小时在谷歌上搜索和调整这个设置,但它仍然不能工作。

我有以下设置:

/src/
 - model.ts
 - bootstrap.ts
/dist/
tsconfig.json
system.config.js
index.html
我的<<p> strong> tsconfig.json
{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es6",
        "noImplicitAny": false,
        "sourceMap": true,
        "removeComments": false,
        "outDir": "./dist/"
    },
    "filesGlob": [
        "./src/**/*.ts"
    ],
    "compileOnSave": true
}

My SystemJS config

System.config({
    paths: {
        // paths serve as alias
        'npm:': 'node_modules/'
    },
    map: {
        testapp: './src'
    },
    baseURL: './src',
    packages: {
        testapp: {
            format: 'register',
            defaultExtension: 'js'
        }
    },
});
我的<<p> strong> index . html
  <script src="/node_modules/systemjs/dist/system-polyfills.js"></script>
    <script src="/node_modules/systemjs/dist/system.src.js"></script>
    <!-- 2. Configure SystemJS -->
    <script src="systemjs.config.js"></script>
    <script>
    System.import('bootstrap.ts')
        .then(function(app) {
            console.log('app bootstrap success!');
        }, console.error.bind(console));
    </script>

最后我在控制台有以下错误:

system.src.js:1051 GET http://0.0.0.0:8080/src/bootstrap.ts.js 404 (Not Found)fetchTextFromURL @ system.src.js:1051....
Error: (SystemJS) XHR error (404 Not Found) loading 

我在一个终端标签中运行tsc -w,在另一个终端标签中运行简单的https服务器。

显然- SystemJS想要使用.ts.js扩展名的文件,而tsc生成。js和源映射,但不是。ts.js.

我是否错过了webpackgulp来完成部分工作?我认为SystemJS和tsc可以做捆绑和编译,但显然有史密斯在构建过程中缺失。对SystemJS设置的解释而不是修复错误也会很有帮助。

设置可以通过以下方式修复:

1)正如@Nitzan Tommer提到的-更改。在System中将。ts转换为。js。

index.html: System.import('bootstrap.js')

2) (SystemJS)要求是没有定义错误是由这篇文章修复改变tsconfig。Json中有"system"作为模块

{
    "compilerOptions": {
        "module": "system",
        "target": "es5",
//..

下面是我用这个设置创建的演示库:https://github.com/shershen08/systemjs-typescript-simple