Question

我是nodejs的新手（熟悉typescript和JS）。我在使用typescript创建使用typescript对浏览器和nodejs都有效的代码时遇到了问题。鉴于以下示例代码，我希望该类可以在节点和浏览器中重用。

-index.html

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />

</head>
<body>
    <script type="text/javascript" src="/js/myabstractclass.js"></script>
    <script type="text/javascript" src="/js/myclass.js"></script>
    <script>
        var myclass = new sample.myclass();
        myclass.log("hello world");
    </script>
</body>
</html>

-nodeserver.ts

var express = require('express');
var webapp = express();
var path = require('path');
var server = require('http').Server(webapp);

var mac = require('./myabstractclass');
var mc = require('./myclass');
mc.log("hello world");

var port = 8081;

webapp.use('/js', express.static(__dirname));
webapp.get('/', function (req, res) {
    res.sendFile(path.join(__dirname, '/index.html'));
});

server.listen(process.env.PORT || port, function () {
    console.log('Listening on ' + server.address().port);
});

-myclass.ts

namespace sample {
    export class myclass extends scripts.myabstractclass {

    }
}

-myabstractclass.ts

namespace scripts {
    export class myabstractclass {
        public log(val: string): void {
            console.log(val);
        }
    }
}

Answer 1

谢谢@estus我确实接受了你的建议并抽象出了一个仅用于UI类的文档和jquery元素（在我的主项目中）。

我对最终采取的方法感到满意（虽然它可能被认为是hackish）。我基本上在每个文件的底部使用module.exports，并将所有内容设置为全局范围。然后我将文件包含一次，并且可以在需要导入的任何地方设置declare var，因为我将所有内容设置为特定的全局范围，所有内容在我第一次调用后都存在。最好的部分，现在我需要的文件是可重用的。

以下是我更新的文件，它们在节点和浏览器中都使用typescript。

- index.html的

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />

</head>
<body>
    <script type="text/javascript" src="/js/myabstractclass.js"></script>
    <script type="text/javascript" src="/js/myclass.js"></script>
    <script>
        var myclass = new sample.myclass();
        myclass.log("hello world");
    </script>
</body>
</html>

- nodeserver.ts

require('./required');

declare var webapp;
declare var express;
declare var server;
declare var path;
declare var myclass;

var m = new sample.myclass();
m.log('hello world');


var port = 8081;

webapp.use('/js', express.static(__dirname));
webapp.get('/', function (req, res) {
    res.sendFile(path.join(__dirname, '/index.html'));
});

server.listen(process.env.PORT || port, function () {
    console.log('Listening on ' + server.address().port);
});

- myclass.ts

namespace sample {
    export class myclass extends scripts.myabstractclass {

    }
}

if (typeof (module) != 'undefined') {
    module.exports = sample.myclass;
}

- myabstractclass.ts

namespace scripts {
    export class myabstractclass {
        public log(val: string): void {
            console.log(val);
        }
    }
}

if (typeof (module) != 'undefined') {
    module.exports = scripts.myabstractclass;
}

- required.ts

global.express = require('express');
global.webapp = express();
global.path = require('path');
global.server = require('http').Server(webapp);
global.scripts = {};
global.scripts.myabstractclass = require('./myabstractclass');
global.sample = {};
global.sample.myclass = require('./myclass');

NodeJS和浏览器的打字稿

1 个答案: