Vue-Async-Computed 项目教程

Vue-Async-Computed 项目教程

vue-async-computedAsync computed properties for Vue.js项目地址:https://gitcode.com/gh_mirrors/vu/vue-async-computed

1. 项目的目录结构及介绍

Vue-Async-Computed 项目的目录结构相对简单，主要包含以下几个部分：

vue-async-computed/
├── dist/
│   ├── vue-async-computed.js
│   └── vue-async-computed.min.js
├── src/
│   ├── index.js
│   └── utils.js
├── test/
│   ├── index.js
│   └── utils.js
├── .babelrc
├── .gitignore
├── .npmignore
├── .travis.yml
├── LICENSE
├── package.json
├── README.md
└── webpack.config.js

目录介绍：

• dist/: 包含编译后的文件，分别是未压缩的 vue-async-computed.js 和压缩版的 vue-async-computed.min.js。
• src/: 源代码目录，包含项目的主要逻辑文件 index.js 和辅助工具文件 utils.js。
• test/: 测试文件目录，包含项目的测试代码。
• .babelrc: Babel 配置文件，用于转换 ES6+ 代码。
• .gitignore: Git 忽略文件配置。
• .npmignore: npm 忽略文件配置。
• .travis.yml: Travis CI 配置文件。
• LICENSE: 项目许可证。
• package.json: 项目依赖和脚本配置文件。
• README.md: 项目说明文档。
• webpack.config.js: Webpack 配置文件，用于打包项目。

2. 项目的启动文件介绍

项目的启动文件位于 src/index.js，这是 Vue-Async-Computed 插件的入口文件。该文件主要负责定义和导出 Vue 插件。

import AsyncComputed from './utils'

export default function plugin(Vue) {
  if (plugin.installed) {
    return
  }
  Vue.mixin(AsyncComputed(Vue))
}

if (typeof window !== 'undefined' && window.Vue) {
  window.Vue.use(plugin)
}

启动文件介绍：

• 导入辅助工具: 从 utils.js 导入 AsyncComputed 函数。
• 定义插件: 定义一个 plugin 函数，该函数接受 Vue 实例作为参数，并在 Vue 实例上混入 AsyncComputed 函数返回的对象。
• 自动安装: 如果项目在浏览器环境中运行，并且存在全局的 Vue 实例，则自动安装该插件。

3. 项目的配置文件介绍

项目的配置文件主要包括 package.json 和 webpack.config.js。

package.json

package.json 文件包含了项目的元数据和依赖信息，以及一些脚本命令。

{
  "name": "vue-async-computed",
  "version": "3.9.0",
  "description": "Support for asynchronous computed properties in Vue.js",
  "main": "dist/vue-async-computed.js",
  "scripts": {
    "build": "webpack --config webpack.config.js",
    "test": "mocha --compilers js:babel-core/register"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/foxbenjaminfox/vue-async-computed.git"
  },
  "keywords": [
    "vue",
    "async",
    "computed"
  ],
  "author": "Benjamin Fox",
  "license": "MIT",
  "bugs": {
    "url": "https://github.com/foxbenjaminfox/vue-async-computed/issues"
  },
  "homepage": "https://github.com/foxbenjaminfox/vue-async-computed#readme",
  "devDependencies": {
    "babel-core": "^6.26.0",
    "babel-loader": "^7.1.2",
    "babel-preset-env": "^1.6.1",
    "mocha": "^4.0.1",
    "vue": "^2.5.2",
    "webpack": "^3.8.1"
  }
}

vue-async-computedAsync computed properties for Vue.js项目地址:https://gitcode.com/gh_mirrors/vu/vue-async-computed