微信小程序 js的模块化引用

1. js文件引用js文件

// 1. 有一个工具函数 util.js

const getNowTimeParse = () => {
  const time = new Date();
  const YYYY = time.getFullYear();
  const MM = time.getMonth() < 9 ? '0' + (time.getMonth() + 1) : (time.getMonth() + 1);
  const DD = time.getDate() < 10 ? '0' + time.getDate() : time.getDate();
  const hh = time.getHours() < 10 ? '0' + time.getHours() : time.getHours();
  const mm = time.getMinutes() < 10 ? '0' + time.getMinutes() : time.getMinutes();
  const ss = time.getSeconds() < 10 ? '0' + time.getSeconds() : time.getSeconds();
  const ms = time.getMilliseconds();

  return `${YYYY}-${MM}-${DD}T${hh}:${mm}:${ss}.${ms}`;
}
module.exports = {
  getNowTimeParse: getNowTimeParse
};

// 2. 业务函数中 需要得到一个标准的日期输入函数

const util = require('../../utils/util.js');
Page({
    onLoad: function () {
        console.log(util.getNowTimeParse); // 2019-07-20T12:45:09
    }
})

2. ts文件引用js文件

// 有一个工具类函数 util.js

const getNowTimeParse = () => {
  const time = new Date();
  const YYYY = time.getFullYear();
  const MM = time.getMonth() < 9 ? '0' + (time.getMonth() + 1) : (time.getMonth() + 1);
  const DD = time.getDate() < 10 ? '0' + time.getDate() : time.getDate();
  const hh = time.getHours() < 10 ? '0' + time.getHours() : time.getHours();
  const mm = time.getMinutes() < 10 ? '0' + time.getMinutes() : time.getMinutes();
  const ss = time.getSeconds() < 10 ? '0' + time.getSeconds() : time.getSeconds();
  const ms = time.getMilliseconds();

  return `${YYYY}-${MM}-${DD}T${hh}:${mm}:${ss}.${ms}`;
}
module.exports = {
  getNowTimeParse: getNowTimeParse
};

// 在业务代码 ts中 使用 （// @ts-ignore  这个必不可少 避免ts报错 编译不通过）

// @ts-ignore
import util = require('../../utils/util.js');
Page({
    onLoad: function () {
        console.log(util.getNowTimeParse); // 2019-07-20T12:45:09
    }
})

3.js中引入ts（ts模板小程序情况下可成功 js模板小程序情况下不可成功）

// 一个 UtilService.ts

export class UtilService {
    constructor() {
    }
    getNowTimeParse() {
        const time = new Date();
        const YYYY = time.getFullYear();
        const MM = time.getMonth() < 9 ? '0' + (time.getMonth() + 1) : (time.getMonth() + 1);
        const DD = time.getDate() < 10 ? '0' + time.getDate() : time.getDate();
        const hh = time.getHours() < 10 ? '0' + time.getHours() : time.getHours();
        const mm = time.getMinutes() < 10 ? '0' + time.getMinutes() : time.getMinutes();
        const ss = time.getSeconds() < 10 ? '0' + time.getSeconds() : time.getSeconds();
        const ms = time.getMilliseconds();

        return `${YYYY}-${MM}-${DD}T${hh}:${mm}:${ss}.${ms}`;
    }
}

// 在js 中使用
const util_1 = require("../../services/utilService");
const utilService = new util_1.UtilService();

Page({
    onLoad: function () {
        console.log(utilService.getNowTimeParse); // 2019-07-20T12:45:09
    }
})

4.在ts中引入ts

// 一个 UtilService.ts

export class UtilService {
    constructor() {
    }
    getNowTimeParse() {
        const time = new Date();
        const YYYY = time.getFullYear();
        const MM = time.getMonth() < 9 ? '0' + (time.getMonth() + 1) : (time.getMonth() + 1);
        const DD = time.getDate() < 10 ? '0' + time.getDate() : time.getDate();
        const hh = time.getHours() < 10 ? '0' + time.getHours() : time.getHours();
        const mm = time.getMinutes() < 10 ? '0' + time.getMinutes() : time.getMinutes();
        const ss = time.getSeconds() < 10 ? '0' + time.getSeconds() : time.getSeconds();
        const ms = time.getMilliseconds();

        return `${YYYY}-${MM}-${DD}T${hh}:${mm}:${ss}.${ms}`;
    }
}

// 在 ts中使用

import { UtilService } from '../../services/utilService'
const utilService = new UtilService()
Page({
    onLoad: function () {
        console.log(utilService.getNowTimeParse); // 2019-07-20T12:45:09
    }
})

5.总结

• 注意文件的导出与导入形式
• 注意文件导入的路径
• ts中使用require会报错 并且不会编译通过 加一行  // @ts-ignore 忽略ts报错就可以了