Интегрируйте один AWS SDK JS для службы браузера с веб-пакетом и Typescript - PullRequest
Новая
       5

Интегрируйте один AWS SDK JS для службы браузера с веб-пакетом и Typescript

0 голосов
/ 29 апреля 2018

У меня есть проект Vue.js, который я интегрировал с Typescript и webpack. Все отлично. Я добавляю простой сервис сообщений SNS, поэтому я интегрировал AWS SDK. Все выглядит хорошо, но, очевидно, я не хочу связывать весь AWS SDK, если я использую его крошечную полоску. Я пытался следовать всем рекомендациям, но безрезультатно.

Проблема

Я бы хотел сделать следующее:

import { SNS } from 'aws-sdk/clients/sns';

но я получаю ошибку

... node_modules / aws-sdk / clients / sns "'не имеет экспортированного члена' SNS '.

Интересно ... * * 1016 import { SNS } from 'aws-sdk' работает совершенно нормально (но оставляет мне 5 МБ + минимизированный файл сборки, поскольку он включает в себя весь SDK). У меня есть обходной путь

Я могу использовать инструмент построения AWS SDK, просто скачав службу SNS, добавить этот файл в мое дерево каталогов и импортировать SNS из этого файла. Это также хорошо работает, и это мой лучший обходной путь. Но теперь я вынужден поддерживать файл за пределами npm, что не очень хорошо.

Есть мысли о том, где я иду не так?

Дополнительная информация, которая может оказаться полезной

Вот дополнительная информация, которая может оказаться полезной.

Мой ts.config.json файл выглядит как 

{
  "compilerOptions": {
    "outDir": "./inc/dist/ts-built/",
    "noImplicitAny": false,
    "noEmitOnError": true,
    "removeComments": false,
    "sourceMap": true,
    "strict":  true, 
    "target": "es5",
    "module": "es2015",
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "moduleResolution": "node"   
  },
  "include": [
    "./inc/src/**/*"
  ],
  "exclude": [
    "node_modules"    
  ]
}

и соответствующая часть моего webpack.config.js файла в настоящее время выглядит как 

var path = require("path");
var webpack = require('webpack');

module.exports = {
    //context: path.resolve(__dirname, "./inc/src"),
    resolve: {
        extensions: ['.ts', '.js', '.vue', '.json'],
        alias: {
            'vue$': 'vue/dist/vue.esm.js'
        }
    },
    entry: {
        main: './inc/src/search/main.ts'
    },
    output: {
        publicPath: '/inc/dist',
        path: path.resolve(__dirname, './inc/dist'),
        filename: '[name].build.js'
    },
    module: {
        rules: [
            {
                test: /\.vue$/,
                loader: 'vue-loader',
                }
            },
            {
                test: /\.tsx?$/,
                loader: 'ts-loader',
                exclude: /node_modules/,
                options: {
                    appendTsSuffixTo: [/\.vue$/],
                }
            },
            {
                test: /\.json$/,
                loader: 'json-loader'
            }
        ]
    }
};
...