小程序(ts)使用npm包

小程序(ts)使用npm包

• 微信小程序开发使用ts编译的基本目录

• 使用网上的将project.config.json文件配置，然后将node_modules整个编译的将会很臃肿, 且每次编译速度会非常非常慢。

{
  ...
  "setting": {
    ... 
    "packNpmManually": true,
    "packNpmRelationList": [
      {
        "packageJsonPath": "package.json",
        "miniprogramNpmDistDir": "./miniprogram"
      }
    ],
  },
  ... 
}

• 方法一：使用上诉方法编译后生成miniprogram_npm的包，然后删除你不需要的依赖。这里我以正在捣鼓的cos-wx-sdk为主。

  

  var COS = require('cos-wx-sdk-v5');
  
  App<IAppOption>({
    globalData: {
    },
    onLaunch() {
      console.log(COS);
    },
  })
  
  

  

• 方法二：

project.config.js值设置npm_dist目录

{
  ...
  "setting": {
    ... 
    "packNpmManually": true,
    "packNpmRelationList": [
      {
        "miniprogramNpmDistDir": "./miniprogram"
      }
    ],
  },
  ... 
}

手动创建minoprogram_npm目录，创建xxx文件放入xxx的核心js文件

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-6GYnmbJw-1632220962248)(/小程序(ts)]使用npm包4.png)

var COS = require('cos-wx-sdk-v5');


App<IAppOption>({
  globalData: {
  },
  onLaunch() {
    console.log(COS, 3);
  },
})