Typescript从CDN加载外部库

时间:2019-01-18 10:53:34

标签: typescript webpack require es6-module-loader

我正在研究一个打字稿解决方案,它将有多个入口点。在我的解决方案中,我使用了一些外部库。我使用webpack + ts-loader进行编译和捆绑。现在,如果我包括所有外部依赖项,那么我的解决方案将完美运行。现在,我试图找出从捆绑中排除外部库并从CDN加载外部库的方法。我四处搜寻,发现我需要包括一个require配置并在其中添加CDN路径。但是我无法弄清楚如何确保将require config文件添加到我的捆绑包中。 我的webpack.config如下:

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const SPSaveWebpackPlugin = require('spsave-webpack-plugin');
module.exports = {
  entry: {
    helloworld:'./app/helloworld/helloworld.ts',
    weather:'./app/weather/weather.ts'
  },
  module: {
    rules: [
      {
        test: /\.tsx?$/,
        use: 'ts-loader',
        exclude: /node_modules/
      }
    ]
  },
  resolve: {
    extensions: [ '.ts', '.js' ]
  },
  target: "node",
  externals:{},
  output: {
    publicPath:'https://siteurl/Style Library/webparts', // to get correct path inside sharepoint
    filename: '[name]-bundle.js',
    path: path.resolve(__dirname, 'dist')
  },
  plugins: [
    new HtmlWebpackPlugin({  // Also generate a test.html
      filename: 'helloworld.html', // name of the output file
      chunks:['helloworld'], // name of the entry point defined above
      template: './app/helloworld/helloworld.html' // path to the html for the webpart
    }),
    new HtmlWebpackPlugin({  // Also generate a test.html
      filename: 'weather.html', // name of the output file
      chunks:['weather'], // name of the entry point defined above
      template: './app/weather/weather.html' // path to the html for the webpart
    }),
    new SPSaveWebpackPlugin({
      "coreOptions": {
          "checkin": true,
          "checkinType": 1,
          "siteUrl": "https://siteurl"
      },
      "credentialOptions": null,
      "fileOptions": {
          "folder": "Style Library/webparts"
      }
  })]
};

我的仓库here中有一个示例解决方案

0 个答案:

没有答案