javascript - 如何将 TS 模块导入或要求到 CommonJS 文件中？

Question

无论出于何种原因，我的一些模块必须是 js 文件。

我像这样导入 ts 模块到我的js 文件中:

resolver.js:

import { Message } from '../../connectors/message';

// console.log('Message: ', Message);

const resolver = {
  Query: {
    sendMessage: (root, args, ctx) => {
      console.log(args, ctx);
      return Message.send('1', 'message');
    }
  }
};

export { resolver };

message.ts:

const Message = {
  send(id, type) {
    return Promise.resolve({
      recipient_id: '123',
      message_id: '122'
    });
  }
};

export { Message };

我使用 webpack 和 awesome-typescript-loader 来编译我的 .ts 文件。

这是我的tsconfig.json:

{
  "compilerOptions": {
    "target": "es6",
    "lib": ["es6", "esnext"],
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "declaration": false,
    "outDir": "dist",
    "typeRoots": ["node_modules/@types"]
  },
  "files": ["src/main.ts"],
  "exclude": ["node_modules"]
}

webpack.config.js:

var nodeExternals = require('webpack-node-externals');
var webpack = require('webpack');
var path = require('path');
var fs = require('fs');

/* helper function to get into build directory */
var distPath = function(name) {
  if (undefined === name) {
    return path.join('dist');
  }

  return path.join('dist', name);
};

var webpack_opts = {
  entry: './src/main.ts',
  target: 'node',
  output: {
    filename: distPath('main.js'),
    libraryTarget: 'commonjs2'
  },
  resolve: {
    extensions: ['.ts', '.js'],
    modules: ['node_modules', 'src']
  },
  plugins: [
    new webpack.LoaderOptionsPlugin({
      options: {
        test: /\.ts$/,
        ts: {
          compiler: 'typescript',
          configFileName: 'tsconfig.json'
        },
        tslint: {
          emitErrors: true,
          failOnHint: true
        }
      }
    })
  ],
  devtool: 'source-map',
  module: {
    loaders: [
      {
        test: /\.ts$/,
        loaders: 'awesome-typescript-loader'
      }
    ]
  },
  externals: [nodeExternals()]
};

module.exports = webpack_opts;

但是我得到了这个错误:

(function (exports, require, module, __filename, __dirname) { import { Message } from '../../connectors/message';
                                                              ^^^^^^

SyntaxError: Unexpected token import
    at new Script (vm.js:51:7)
    at createScript (vm.js:136:10)
    at Object.runInThisContext (vm.js:197:10)
    at Module._compile (internal/modules/cjs/loader.js:618:28)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:665:10)
    at Module.load (internal/modules/cjs/loader.js:566:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:506:12)
    at Function.Module._load (internal/modules/cjs/loader.js:498:3)
    at Module.require (internal/modules/cjs/loader.js:598:17)
    at require (internal/modules/cjs/helpers.js:11:18)

如何解决？

-- 更新 v1 --

我尝试将它与 require 一起使用

// import { Message } from '../../connectors/message';

const { Message } = require('../../connectors/message');

console.log('Message: ', Message);

const resolver = {
  Query: {
    sendMessage: (root, args, ctx) => {
      console.log(args, ctx);
      return Message.send('1', 'message');
    }
  }
};

export { resolver };

但是还是报错:

internal/modules/cjs/loader.js:550
    throw err;
    ^

Error: Cannot find module '../../connectors/message'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:548:15)
    at Function.Module._load (internal/modules/cjs/loader.js:475:25)
    at Module.require (internal/modules/cjs/loader.js:598:17)
    at require (internal/modules/cjs/helpers.js:11:18)
    at Object.<anonymous> (/Users/ldu020/workspace/workplace-adapter-graphql/src/graphql/modules/messages/resolver.js:3:21)
    at Module._compile (internal/modules/cjs/loader.js:654:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:665:10)
    at Module.load (internal/modules/cjs/loader.js:566:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:506:12)
    at Function.Module._load (internal/modules/cjs/loader.js:498:3)

-- 更新 v2 --

我将 .ts 文件扩展名添加到路径:

const { Message } = require('../../connectors/message.ts');

仍然有错误:

    export { Message };
^^^^^^

SyntaxError: Unexpected token export
    at new Script (vm.js:51:7)
    at createScript (vm.js:136:10)
    at Object.runInThisContext (vm.js:197:10)
    at Module._compile (internal/modules/cjs/loader.js:618:28)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:665:10)
    at Module.load (internal/modules/cjs/loader.js:566:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:506:12)
    at Function.Module._load (internal/modules/cjs/loader.js:498:3)
    at Module.require (internal/modules/cjs/loader.js:598:17)
    at require (internal/modules/cjs/helpers.js:11:18)

更新 3:添加 package.json

"devDependencies": {
    "@types/faker": "^4.1.4",
    "@types/jest": "^19.2.4",
    "@types/node": "^7.10.0",
    "babel-cli": "^6.26.0",
    "faker": "^4.1.0",
    "jest": "^20.0.4",
    "ts-jest": "^20.0.6",
    "ts-node": "^3.2.0",
    "tslint": "^5.11.0",
    "typescript": "^2.9.2"
  },

Answer 1

您的节点版本不支持导入。使用 require 代替:

var Message = require('./path').Message;

-- 更新--由于您正在尝试导入 .ts 文件，因此您需要将其写入路径。像这样:require('./path.ts');