Upwork Jobs Feed Tracker 项目教程

最新推荐文章于 2024-09-25 08:47:52 发布

丁绮倩

最新推荐文章于 2024-09-25 08:47:52 发布

阅读量760

点赞数 8

本文链接：https://blog.csdn.net/gitblog_00167/article/details/141710177

版权

Upwork Jobs Feed Tracker 项目教程

upwork-jobs-feed-trackerConvenient way to track new jobs for Upwork freelancers.项目地址:https://gitcode.com/gh_mirrors/up/upwork-jobs-feed-tracker

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

upwork-jobs-feed-tracker/
├── src/
│   ├── gitignore
│   ├── LICENSE
│   ├── icon.png
│   ├── logo.sketch
│   ├── manifest.json
│   ├── notification-icon.png
│   ├── notification.mp3
│   ├── package.json
│   ├── promotional.png
│   ├── readme.md
│   ├── search.png
│   ├── webpack.config.js
│   └── yarn.lock

src/：项目的源代码目录。
- gitignore：Git忽略文件配置。
- LICENSE：项目许可证文件。
- icon.png：扩展图标文件。
- logo.sketch：项目Logo设计文件。
- manifest.json：Chrome扩展的清单文件。
- notification-icon.png：通知图标文件。
- notification.mp3：通知音频文件。
- package.json：Node.js项目配置文件。
- promotional.png：推广图片文件。
- readme.md：项目说明文档。
- search.png：搜索图标文件。
- webpack.config.js：Webpack配置文件。
- yarn.lock：Yarn依赖锁定文件。

2. 项目的启动文件介绍

项目的启动文件主要是manifest.json，它是Chrome扩展的核心配置文件。以下是该文件的部分内容：

{
  "manifest_version": 2,
  "name": "Upwork Jobs Feed Tracker",
  "version": "1.0",
  "description": "Allows you to track your personal jobs feed on Upwork and immediately notifies you whenever new job appears.",
  "icons": {
    "16": "icon.png",
    "48": "icon.png",
    "128": "icon.png"
  },
  "background": {
    "scripts": ["background.js"],
    "persistent": false
  },
  "permissions": [
    "notifications",
    "storage",
    "https://www.upwork.com/"
  ],
  "browser_action": {
    "default_icon": "icon.png",
    "default_title": "Upwork Jobs Feed Tracker"
  }
}

manifest_version：清单文件版本，目前为2。
name：扩展的名称。
version：扩展的版本号。
description：扩展的描述。
icons：扩展的图标。
background：后台脚本配置。
permissions：扩展所需的权限。
browser_action：浏览器动作配置。

3. 项目的配置文件介绍

项目的配置文件主要是webpack.config.js，它是Webpack的配置文件。以下是该文件的部分内容：

const path = require('path');

module.exports = {
  entry: './src/index.js',
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'bundle.js'
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader'
        }
      },
      {
        test: /\.css$/,
        use: ['style-loader', 'css-loader']
      }
    ]
  }
};