Question

我只是尝试以最少的可能设置创建概念验证TS + SystemJS项目 - 没有＆＃34; Angular2入门套件＆＃34;等等。我花了一个小时谷歌搜索和调整此设置，但它仍然无法正常工作。

我有以下设置：

/src/
 - model.ts
 - bootstrap.ts

/dist/

tsconfig.json
system.config.js
index.html

我的 tsconfig.json

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es6",
        "noImplicitAny": false,
        "sourceMap": true,
        "removeComments": false,
        "outDir": "./dist/"
    },
    "filesGlob": [
        "./src/**/*.ts"
    ],
    "compileOnSave": true
}

我的 SystemJS配置

System.config({
    paths: {
        // paths serve as alias
        'npm:': 'node_modules/'
    },
    map: {
        testapp: './src'
    },
    baseURL: './src',
    packages: {
        testapp: {
            format: 'register',
            defaultExtension: 'js'
        }
    },

});

我的 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和源地图但 NOT .ts.js 。

我是否会错过webpack或gulp来完成工作的某些部分？我认为SystemJS和tsc可以进行捆绑和转换，但显然在构建过程中缺少了smth。关于SystemJS设置的解释而不是修复bug也会非常有帮助。

Answer 1

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

1）提到@Nitzan Tommer - 在System.import 块中将 .ts更改为.js

Error: subquery must return only one column

2）（SystemJS）要求未定义错误由this post修复 - 更改tsconfig.json以将“system”作为模块

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

以下是我使用此设置创建的演示回购：https://github.com/shershen08/systemjs-typescript-simple

Systemjs和tsc setup - * .ts.js 404（Not Found）错误

1 个答案: