zt-minicomonent v0.0.6

主要作为练习使用

1、不把额外的文件上传

components/
pages/
app.js
app.json
app.wxss
package.json
# 或者把package.json放要上传的文件夹下,上面表示不上传到npm

2、package.json

{
  "name": "zt-minicomonent",
  "version": "0.0.2",
  "description": "zt小程序组件库",
  "main": "index.js", // 入口，一般小程序没啥用
  "miniprogram": "packages", // 打包入口
  "files ": ["packages"], // 要上传的文件
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/zhangtaouc/miniComonents.git"
  },
  "keywords": ["微信小程序", "zt", "miniprogram"],
  "author": "zhangtaouc",
  "license": "ISC",
  "bugs": {
    "url": "https://github.com/zhangtaouc/miniComonents/issues"
  },
  "homepage": "https://github.com/zhangtaouc/miniComonents#readme",
  "dependencies": {
    "zt-minicomonent": "^0.0.2"
  }
}

3、创建页面的时候要以组件的形式

{
  "component": true
}

4、组件使用

{
  "usingComponents": {
    "zt-test": "zt-minicomonent/zt-test"
  }
}

5、项目格式化

下载 prettierr 插件，配合.prettierrc

{
  // 一行最多多少个字符
  "printWidth": 200,
  // 指定每个缩进级别的空格数
  "tabWidth": 2,
  // 使用制表符而不是空格缩进行
  "useTabs": true,
  // 在语句末尾打印分号
  "semi": false,
  // 使用单引号而不是双引号
  "singleQuote": true,
  // 更改引用对象属性的时间 可选值"<as-needed|consistent|preserve>"
  "quoteProps": "as-needed",
  // 在JSX中使用单引号而不是双引号
  "jsxSingleQuote": false,
  // 多行时尽可能打印尾随逗号。（例如，单行数组永远不会出现逗号结尾。） 可选值"<none|es5|all>"，默认none
  "trailingComma": "es5",
  // 在对象文字中的括号之间打印空格
  "bracketSpacing": true,
  // jsx 标签的反尖括号需要换行
  "jsxBracketSameLine": false,
  // 在单独的箭头函数参数周围包括括号 always：(x) => x \ avoid：x => x
  "arrowParens": "always",
  // 不需要自动在文件开头插入 @prettier
  "insertPragma": false,
  // 使用默认的折行标准 always\never\preserve
  "proseWrap": "preserve",
  // 指定HTML文件的全局空格敏感度 css\strict\ignore
  "htmlWhitespaceSensitivity": "css",
  // Vue文件脚本和样式标签缩进
  "vueIndentScriptAndStyle": false,
  // 换行符使用 lf 结尾是 可选值"<auto|lf|crlf|cr>"
  "endOfLine": "lf",
  "overrides": [
    {
      "files": "*.wxml",
      "options": {
        "parser": "html"
      }
    },
    {
      "files": "*.wxss",
      "options": {
        "parser": "css"
      }
    },
    {
      "files": "*.wxs",
      "options": {
        "parser": "babel"
      }
    }
  ]
}

在微信开发工具中加入

"editor.formatOnSave": true,
    "[json]": {
      "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[javascript]": {
      "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "prettier.documentSelectors": ["**/*.wxml", "**/*.wxss", "**/*.wxs"]

6、工具类使用

const method = require('zt-minicomonent')
method.xxx