Mr.Yuan Mr.Yuan

苟正其身矣,于从政乎何有?不能正其身,如正人何?

目录
【Wepy 2.0】使用 Typescript
/  

【Wepy 2.0】使用 Typescript

wepy 作者 npm 库地址

@wepy/compiler-typescript:包地址

安装

npm install @wepy/compiler-typescript --save-dev

# 下面几个插件需要安装,避免使用过程N多bug
npm install --save-dev @babel/plugin-proposal-class-properties
npm install --save-dev @babel/plugin-proposal-object-rest-spread
npm install --save-dev @babel/plugin-proposal-export-default-from
npm install --save-dev @babel/plugin-proposal-decorators
npm install --save-dev @babel/plugin-transform-typescript

配置

修改配置文件 wepy.config.js

const TypeScriptCompiler = require('@wepy/compiler-typescript');

module.exports = {
  "plugins": [
      TypeScriptCompiler()
  ]
};

添加babel 插件支持

babel: {
      sourceMap: true,
      presets: [
        '@babel/preset-env',
        // '@babel/preset-typescript'
      ],
      plugins: [
        '@wepy/babel-plugin-import-regenerator',
        // add for typescript
        '@babel/plugin-proposal-class-properties',
        '@babel/plugin-proposal-object-rest-spread',
        '@babel/plugin-proposal-export-default-from',
        [
          "@babel/plugin-proposal-decorators",
          {
            "legacy": true
          }
        ],
        '@babel/plugin-transform-typescript',
      ]
},

使用

wepy 文件中使用

<script lang="typescript">
import wepy from '@wepy/core';

wepy.component({
  data: {},
  computed: {},
  methods: {},
  created() {}, 
});
</script>

可能遇到的问题

image.png

没有安装 typescript

Fix:

npm install --save-dev typescript

标题:【Wepy 2.0】使用 Typescript
作者:K
地址:https://pala.icu/articles/2020/08/12/1597225747131.html