{"id":32392,"date":"2024-01-17T01:24:44","date_gmt":"2024-02-07T23:33:01","guid":{"rendered":"https:\/\/www.silicloud.com\/zh\/blog\/%e4%bd%bf%e7%94%a8nuxt-js%e5%92%8cvuetify%e5%88%9b%e5%bb%ba%e4%b8%80%e4%b8%aahello-world%e9%a1%b5%e9%9d%a2%e3%80%82-2\/"},"modified":"2024-05-04T18:43:25","modified_gmt":"2024-05-04T10:43:25","slug":"%e4%bd%bf%e7%94%a8nuxt-js%e5%92%8cvuetify%e5%88%9b%e5%bb%ba%e4%b8%80%e4%b8%aahello-world%e9%a1%b5%e9%9d%a2%e3%80%82-2","status":"publish","type":"post","link":"https:\/\/www.silicloud.com\/zh\/blog\/%e4%bd%bf%e7%94%a8nuxt-js%e5%92%8cvuetify%e5%88%9b%e5%bb%ba%e4%b8%80%e4%b8%aahello-world%e9%a1%b5%e9%9d%a2%e3%80%82-2\/","title":{"rendered":"\u4f7f\u7528Nuxt.js\u548cVuetify\u521b\u5efa\u4e00\u4e2aHello World\u9875\u9762"},"content":{"rendered":"<p>\u6211\u662f\u5408\u540c\u4f1a\u793ekumanote\u7684\u7530\u4e2d\u3002<\/p>\n<p>\u6211\u6700\u8fd1\u901a\u8fc7\u4f7f\u7528Google Drive API\uff0c\u5f00\u53d1\u4e86\u4e00\u4e2a\u8ba9Google Drive\u6587\u6863\u53ef\u89c6\u5316\u7684\u5de5\u5177\u3002<\/p>\n<p>\u6211\u7528Nuxt.js\u548cFastAPI\uff08\u636e\u8bf4\u662f\u6027\u80fd\u51fa\u8272\u7684Python web\u6846\u67b6\uff09\u5236\u4f5c\u4e86\u8fd9\u4e2a\u9879\u76ee\u3002\u56e0\u6b64\uff0c\u4e3a\u4e86\u80fd\u591f\u5206\u4eab\u7ed9\u5927\u5bb6\uff0c\u6211\u51b3\u5b9a\u516c\u5f00\u5236\u4f5c\u7684\u65b9\u6cd5\u3002<\/p>\n<p>\u3053\u3053\u3067\u9023\u8f09\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\n<p>github\u306b\u3082\u9023\u8f09\u306b\u5408\u308f\u305b\u3066\u30bd\u30fc\u30b9\u30b3\u30fc\u30c9\u3092\u30a2\u30c3\u30d7\u3057\u3066\u884c\u3063\u3066\u3044\u307e\u3059\u3002<\/p>\n<p>\u5728\u8fd9\u91cc\uff0c\u6211\u4e5f\u4f1a\u4ecb\u7ecd\u5982\u4f55\u5728Nuxt.js\u4e2d\u5f15\u5165Vuetify\u63d2\u4ef6\uff0c\u5e76\u7f16\u5199Hello world\u7684\u90e8\u5206\u3002<\/p>\n<p>\u987a\u5e26\u4e00\u63d0\uff0cVuetify\u662f\u4e00\u4e2a\u9075\u5faaGoogle\u5f00\u53d1\u7684Material Design\u8bbe\u8ba1\u7406\u5ff5\u7684\u6846\u67b6\uff0c\u7c7b\u4f3c\u4e8e\u57fa\u4e8eMaterial Design\u7684Bootstrap\u7248\u672c\u7684\u6982\u5ff5\u3002<\/p>\n<h1>\u9879\u76ee\u7684\u76ee\u5f55\u7ed3\u6784<\/h1>\n<p>\u8fd9\u6b21\u5f00\u53d1\u7684\u5e94\u7528\u7684\u76ee\u5f55\u7ed3\u6784\u5982\u4e0b\u3002<\/p>\n<p>\u5927\u81f4\u4e0a\u4f1a\u5982\u4e0b\u6240\u8ff0\u3002<\/p>\n<pre class=\"post-pre\"><code>gdrive-manager\r\n\u251c\u2500\u2500 client\r\n\u2502\u00a0\u00a0 \u251c\u2500\u2500 README.md\r\n\u2502\u00a0\u00a0 \u251c\u2500\u2500 assets\r\n\u2502\u00a0\u00a0 \u251c\u2500\u2500 components\r\n\u2502\u00a0\u00a0 \u251c\u2500\u2500 layouts\r\n\u2502\u00a0\u00a0 \u251c\u2500\u2500 nuxt.config.js\r\n\u2502\u00a0\u00a0 \u251c\u2500\u2500 package.json\r\n\u2502\u00a0\u00a0 \u251c\u2500\u2500 pages\r\n\u2502\u00a0\u00a0 \u251c\u2500\u2500 plugins\r\n\u2502\u00a0\u00a0 \u251c\u2500\u2500 static\r\n\u2502\u00a0\u00a0 \u2514\u2500\u2500 store\r\n\u2514\u2500\u2500 server\r\n    \u251c\u2500\u2500 README.md\r\n    \u251c\u2500\u2500 alembic\r\n    \u251c\u2500\u2500 alembic.ini\r\n    \u251c\u2500\u2500 app\r\n    \u2502   \u2514\u2500\u2500 api\r\n    \u2502       \u2514\u2500\u2500 v1\r\n    \u2502           \u2514\u2500\u2500 endpoints\r\n    \u2514\u2500\u2500 pyproject.toml\r\n<\/code><\/pre>\n<ul class=\"post-ul\">\n<li style=\"list-style-type: none;\">\n<ul class=\"post-ul\">\u4e00\u756atop\u306e\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\uff08gdrive-manager\uff09\u306e\u4e0b\u306b client \u3068 server \u306e\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u3092\u4f5c\u6210\u3057\u307e\u3059\u3002<\/ul>\n<\/li>\n<\/ul>\n<p>client\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u306e\u4e2d\u306b\u306f Nuxt.js \u306e\u30a2\u30d7\u30ea\u95a2\u4fc2\u306e\u30d5\u30a1\u30a4\u30eb\u3092\u914d\u7f6e\u3057\u307e\u3059\u3002<br \/>\nserver\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u306e\u4e2d\u306b\u306f FastAPI \u306e\u30a2\u30d7\u30ea\u95a2\u4fc2\u306e\u30d5\u30a1\u30a4\u30eb\u3092\u914d\u7f6e\u3057\u307e\u3059\u3002<\/p>\n<p>server\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u306e\u4e2d\u306b\u306f\u3082\u3063\u3068\u591a\u304f\u306e\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u304c\u3067\u304d\u307e\u3059\u304c\u3001\u4eca\u56de\u306f\u7701\u7565\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\n<h1>\u4e8b\u524d\u51c6\u5907<\/h1>\n<h2>\u5f15\u8a00<\/h2>\n<ul class=\"post-ul\">\u79c1\u306fMac OSX Catalina\u3067\u4f5c\u696d\u3057\u3066\u3044\u307e\u3059\u3002Windows\u3084Linux\u30e6\u30fc\u30b6\u30fc\u306e\u65b9\u306f\u30b3\u30de\u30f3\u30c9\u3092\u9069\u6642\u8aad\u307f\u66ff\u3048\u3066\u304f\u3060\u3055\u3044\u3002<\/ul>\n<h2>\u5b89\u88c5Node.js\/Yarn<\/h2>\n<h3>\u63a8\u8350\u7684\u5b89\u88c5\u65b9\u6cd5<\/h3>\n<p>\u6211\u63a8\u8350\u4f7f\u7528nodenv\u8fd9\u4e2a\u5de5\u5177\u3002<br \/>\nnodenv\u9002\u5408\u7528\u4e8e\u5bf9\u6bcf\u4e2a\u76ee\u5f55\u7ba1\u7406nodejs\u7684\u7248\u672c\u3002<\/p>\n<p>\u6bd4\u5982\u8bf4\uff0c\u5728\u9879\u76eeA\u4e2d\uff0c\u5047\u8bbe\u6211\u4eec\u4f7f\u7528v12\u7684nodejs\u6765\u5728\u9879\u76eeB\u4e2d\u4f7f\u7528v10\u3002\u90a3\u4e48\uff0c\u5982\u679c\u5728\u7535\u8111\u4e0a\u5b89\u88c5v10\uff0c\u5f53\u6211\u4eec\u60f3\u8981\u8fdb\u884c\u9879\u76eeB\u7684\u5de5\u4f5c\u65f6\uff0c\u5c31\u9700\u8981\u5378\u8f7dv10\u5e76\u5b89\u88c5v12\uff0c\u8fd9\u6837\u4f1a\u4ea7\u751f\u4e00\u4e9b\u989d\u5916\u7684\u5de5\u4f5c\u3002<br \/>\n\u56e0\u6b64\uff0c\u4e00\u822c\u7684\u505a\u6cd5\u662f\u5c06v10\u548cv12\u5206\u522b\u5b89\u88c5\u5728\u4e0d\u540c\u7684\u76ee\u5f55\u4e2d\uff0c\u5e76\u91cd\u65b0\u8bbe\u7f6ePATH\u73af\u5883\u53d8\u91cf\uff0c\u4f46\u628a\u8fd9\u4e2a\u8fc7\u7a0b\u5de5\u5177\u5316\u7684\u4ea7\u7269\u5c31\u662fnodenv\u3002<\/p>\n<p>\u8fd9\u4e2a nodenv \u662f\u4e00\u4e2a\u7528\u4e8e\u7ba1\u7406 nodejs \u7684\u5de5\u5177\uff0c\u4f46\u4e5f\u6709\u5176\u4ed6\u9488\u5bf9\u4e0d\u540c\u8bed\u8a00\u7684\u5de5\u5177\uff0c\u6bd4\u5982 pyenv (\u7528\u4e8e Python) \u548c rbenv (\u7528\u4e8e Ruby)\u3002\u6709\u4e00\u4e2a\u53eb anyenv \u7684\u5de5\u5177\u53ef\u4ee5\u7ba1\u7406\u8fd9\u4e9b XXenv \u5de5\u5177\uff0c\u6211\u4e5f\u5728\u7528\u5b83\u3002\u4f7f\u7528 anyenv\uff0c\u53ef\u4ee5\u4f7f\u7528\u5176\u547d\u4ee4\u6765\u5b89\u88c5 nodenv\u3001pyenv\u7b49\u5de5\u5177\u3002<\/p>\n<p>\u6b64\u5916\uff0c\u5728nodenv\u4e2d\uff0c\u5982\u679c\u5b89\u88c5\u4e86\u7279\u5b9a\u7248\u672c\u7684node\uff0c\u8fd8\u6709\u4e00\u4e2a\u5de5\u5177\u53ebnodenv-yarn-install\u4f1a\u81ea\u52a8\u5b89\u88c5yarn\uff08nodejs\u7684\u5305\u7ba1\u7406\u5668\uff09\uff0c\u6211\u4e5f\u5728\u8fd9\u91cc\u4f7f\u7528\u5b83\uff0c\u975e\u5e38\u65b9\u4fbf\u3002<\/p>\n<p>\u603b\u7ed3\u8d77\u6765\u5927\u81f4\u5982\u4e0b\u3002<\/p>\n<ol>\n<li style=\"list-style-type: none;\">\n<ol>\u4e3a\u4e86\u5b89\u88c5\uff08\u7ba1\u7406\uff09nodenv\uff0c\u9700\u8981\u9996\u5148\u5b89\u88c5anyenv<\/ol>\n<\/li>\n<\/ol>\n<p>&nbsp;<\/p>\n<ol>\n<li style=\"list-style-type: none;\">\n<ol>\u4f7f\u7528anyenv\u6765\u5b89\u88c5nodenv<\/ol>\n<\/li>\n<\/ol>\n<p>&nbsp;<\/p>\n<ol>\n<li style=\"list-style-type: none;\">\n<ol>\u5b89\u88c5nodenv-yarn-install<\/ol>\n<\/li>\n<\/ol>\n<p>&nbsp;<\/p>\n<ol>\n<li style=\"list-style-type: none;\">\n<ol>\u4f7f\u7528nodenv\u6765\u5b89\u88c5\u7279\u5b9a\u7684nodejs\u7248\u672c<\/ol>\n<\/li>\n<\/ol>\n<p>&nbsp;<\/p>\n<ol>\u4f7f\u7528nodenv\u6765\u56fa\u5b9a\u672c\u9879\u76ee\u7684nodejs\u7248\u672c<\/ol>\n<p>\u56e0\u4e3a\u8fd9\u4e0e\u672c\u6587\u7684\u4e3b\u65e8\u65e0\u5173\uff0c\u6240\u4ee5\u6211\u5c06\u7701\u7565\u6bcf\u4e2a\u5de5\u5177\u7684\u5b89\u88c5\u65b9\u6cd5\u3002\u8bf7\u57fa\u672c\u6309\u7167GitHub\u7684Readme\u4e2d\u6240\u5199\u7684\u5185\u5bb9\u8fdb\u884c\u5b89\u88c5\u3002<\/p>\n<h3>\u5b89\u88c5Node.js<\/h3>\n<p>\u8bf7\u5b89\u88c5Node.js\u3002\u6211\u5df2\u7ecf\u5b89\u88c5\u4e86\u7248\u672cv13.12\u3002<br \/>\n\u5c3d\u7ba1\u6211\u6ca1\u6709\u8fdb\u884c\u8fc7\u6d4b\u8bd5\uff0c\u4f46\u6211\u8ba4\u4e3a\u5b83\u53ef\u4ee5\u5728\u7a0d\u6709\u4e0d\u540c\u7684\u7248\u672c\u4e0a\u8fd0\u884c\u3002<\/p>\n<p>\u5f53\u7136\u53ef\u4ee5\u4eceNode.js\u5b98\u65b9\u7f51\u7ad9\u8fdb\u884c\u5b89\u88c5\uff0c\u800c\u4e0d\u4ec5\u4ec5\u662f\u63a8\u8350\u7684\u5b89\u88c5\u65b9\u5f0f\u3002<\/p>\n<pre class=\"post-pre\"><code>% node -v\r\nv13.12.0\r\n<\/code><\/pre>\n<h3>\u5b89\u88c5yarn<\/h3>\n<p>\u5373\u4f7f\u4e0d\u662f\u63a8\u8350\u5b89\u88c5\u65b9\u5f0f\uff0c\u5f53\u7136\u4e5f\u53ef\u4ee5\u901a\u8fc7\u6b64\u7f51\u7ad9\u8fdb\u884c\u5b89\u88c5\u3002<\/p>\n<pre class=\"post-pre\"><code>% yarn -v\r\n1.22.4\r\n<\/code><\/pre>\n<h1>\u4f60\u597d\uff0c\u4e16\u754c\u3002<\/h1>\n<p>\u8bdd\u867d\u6709\u70b9\u957f\uff0c\u4f46\u6211\u4eec\u9a6c\u4e0a\u5f00\u59cb\u5f00\u53d1Nuxt.js\u5e94\u7528\u3002<\/p>\n<h2>\u521b\u5efaTOP\u76ee\u5f55<\/h2>\n<p>\u9996\u5148\uff0c\u521b\u5efa\u9879\u76ee\u7684\u9876\u7ea7\u76ee\u5f55\u3002\u4ee5\u540d\u79f0\u4e3a&#8221;gdrive-manager&#8221;\u7684\u65b9\u5f0f\u521b\u5efa\u3002\uff08\u540d\u79f0\u53ef\u4ee5\u968f\u610f\u3002\uff09<\/p>\n<pre class=\"post-pre\"><code>% mkdir gdrive-manager\r\n<\/code><\/pre>\n<h2>\u5236\u4f5c\u5e94\u7528\u7a0b\u5e8f\u7684\u6a21\u677f<\/h2>\n<p>\u63a5\u4e0b\u6765\uff0c\u5207\u6362\u5230TOP\u76ee\u5f55\uff0c\u5e76\u6267\u884c\u521b\u5efaNuxt.js\u5e94\u7528\u7684\u547d\u4ee4\u3002<\/p>\n<pre class=\"post-pre\"><code>% cd gdrive-manager\r\n% yarn create nuxt-app client\r\nyarn create v1.22.4\r\n[1\/4] ?  Resolving packages...\r\n[2\/4] ?  Fetching packages...\r\n[3\/4] ?  Linking dependencies...\r\n[4\/4] ?  Building fresh packages...\r\nsuccess Installed \"create-nuxt-app@2.15.0\" with binaries:\r\n      - create-nuxt-app\r\n[###################################################################################################################################################] 339\/339\r\ncreate-nuxt-app v2.15.0\r\n\u2728  Generating Nuxt.js project in client\r\n? Project name gdrive-manager-client\r\n? Project description gdrive-manager nuxt.js based client app \r\n? Author name Hiroki Tanaka\r\n? Choose programming language JavaScript\r\n? Choose the package manager Yarn\r\n? Choose UI framework Vuetify.js\r\n? Choose custom server framework None (Recommended)\r\n? Choose Nuxt.js modules Axios, Progressive Web App (PWA) Support, DotEnv\r\n? Choose linting tools ESLint, Prettier, Lint staged files, StyleLint\r\n? Choose test framework None\r\n? Choose rendering mode Universal (SSR)\r\n? Choose development tools Semantic Pull Requests\r\nyarn run v1.22.4\r\n$ eslint --ext .js,.vue --ignore-path .gitignore . --fix\r\n\u2728  Done in 1.90s.\r\n\r\n?  Successfully created project gdrive-manager-client\r\n\r\n  To get started:\r\n\r\n    cd client\r\n    yarn dev\r\n\r\n  To build &amp; start for production:\r\n\r\n    cd client\r\n    yarn build\r\n    yarn start\r\n\r\n\u2728  Done in 152.84s.\r\n<\/code><\/pre>\n<p>\u6267\u884c\u4e4b\u540e\u4f1a\u51fa\u73b0\u51e0\u4e2a\u9009\u62e9\u9898\uff0c\u6839\u636e\u4ee5\u4e0b\u65b9\u5f0f\u8fdb\u884c\u9009\u62e9\u3002<\/p>\n<div>\n<div class=\"post-table\">\u9805\u76ee\u540d\u9078\u629e\u3059\u308b\u5185\u5bb9\u30e1\u30e2Project namegdrive-manager-clientNuxt.js\u30a2\u30d7\u30ea\u306e\u540d\u524d\u3001\u9069\u5f53\u3067OKProject descriptiongdrive-manager nuxt.js based client appNuxt.js\u30a2\u30d7\u30ea\u306e\u8a73\u7d30\u3001\u9069\u5f53\u3067OKAuthor nameHiroki Tanaka\u5236\u4f5c\u8005\u306e\u540d\u524d\u3001\u9069\u5f53\u3067OKprogramming languageJavaScriptTypeScript\u3068\u3044\u3046\u306e\u3082\u9078\u3079\u308b\u3051\u308c\u3069\u3001\u96e3\u3057\u3044\u306e\u3067\u3001JavaScript\u306b\u3057\u307e\u3057\u305fthe package managerYarn<br \/>\nUI frameworkVuetify.jsMaterial Design\u30d9\u30fc\u30b9\u306e\u30d5\u30ec\u30fc\u30e0\u30ef\u30fc\u30af\u3067\u3059\u3002\u304b\u306a\u308a\u30aa\u30b9\u30b9\u30e1custom server frameworkNone (Recommended)<br \/>\nNuxt.js modules\u3000Axios, Progressive Web App (PWA) Support, DotEnv\u30b9\u30da\u30fc\u30b9\u30ad\u30fc\u3092\u4f7f\u3063\u3066\u5168\u90e8\u9078\u629elinting toolsESLint, Prettier, Lint staged files, StyleLint\u30b9\u30da\u30fc\u30b9\u30ad\u30fc\u3092\u4f7f\u3063\u3066\u5168\u90e8\u9078\u629etest frameworkNoneUnit Test\u306f\u4eca\u56de\u4f7f\u308f\u306a\u3044\u3067\u3059rendering modeUniversal (SSR)Server Side Rendering\u3092\u6307\u5b9a\u3057\u307e\u3057\u3087\u3046development toolsSemantic Pull Requests\u4efb\u610f\u3067\u3059\u3002\u9078\u3093\u3067\u304a\u304f\u3068\u3001git\u306e\u30b3\u30e1\u30f3\u30c8\u306b\u6c17\u3092\u3064\u3051\u308b\u3088\u3046\u306b\u306a\u308a\u307e\u3059\u3002<\/div>\n<\/div>\n<p>\u5f53\u6267\u884c\u6b64\u547d\u4ee4\u65f6\uff0c\u4f1a\u5728TOP\u76ee\u5f55\u4e0b\u521b\u5efa\u4e00\u4e2a\u540d\u4e3aclient\u7684\u6587\u4ef6\u5939\u3002\u6587\u4ef6\u5939\u4e2d\u4f1a\u81ea\u52a8\u751f\u6210Nuxt.js\u6a21\u677f\u9879\u76ee\u7684\u6587\u4ef6\u3002<\/p>\n<h2>\u9996\u6b21\u542f\u52a8<\/h2>\n<p>\u73b0\u5728\uff0c\u5df2\u7ecf\u51c6\u5907\u597d\u542f\u52a8Nuxt.js\u5e94\u7528\u7a0b\u5e8f\u4e86\u3002<\/p>\n<p>\u8ba9\u6211\u4eec\u8fdb\u5165\u521b\u5efa\u7684\u5ba2\u6237\u7aef\u76ee\u5f55\uff0c\u5e76\u6267\u884c\u4ee5\u4e0b\u5185\u5bb9\u3002<\/p>\n<pre class=\"post-pre\"><code>% yarn run dev\r\nyarn run v1.22.4\r\n$ nuxt\r\n\r\n   \u256d\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u256e\r\n   \u2502                                             \u2502\r\n   \u2502   Nuxt.js v2.12.2                           \u2502\r\n   \u2502   Running in development mode (universal)   \u2502\r\n   \u2502                                             \u2502\r\n   \u2502   Listening on: http:\/\/localhost:3000\/      \u2502\r\n   \u2502                                             \u2502\r\n   \u2570\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u256f\r\n<\/code><\/pre>\n<p>\u6267\u884c\u540e\u4f1a\u663e\u793a\u4e00\u4e2a\u6d88\u606f\uff0c\u5185\u5bb9\u662f\u6b63\u5728http:\/\/localhost:3000\/\u4e0a\u542f\u52a8\uff0c\u8bf7\u4f7f\u7528\u6d4f\u89c8\u5668\u8bbf\u95eehttp:\/\/localhost:3000\/\u3002<\/p>\n<p>\u5982\u679c\u80fd\u770b\u5230\u4ee5\u4e0b\u5c4f\u5e55\uff0c\u5c31\u8868\u793a\u6210\u529f\u4e86\u3002<\/p>\n<div><img decoding=\"async\" class=\"post-images\" title=\"\" src=\"https:\/\/cdn.silicloud.com\/blog-img\/blog\/img\/657d11e337434c4406bf4b6d\/47-0.png\" alt=\"97b0876e9ca711ea9ad24201c0a80102_hello-world-min.png\" \/><\/div>\n<p>\u4ee5\u4e0a\u5c31\u662f\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u6211\u662f\u5408\u540c\u4f1a\u793ekumanote\u7684\u7530\u4e2d\u3002 \u6211\u6700\u8fd1\u901a\u8fc7\u4f7f\u7528Google Drive API\uff0c\u5f00\u53d1\u4e86\u4e00\u4e2a\u8ba9Google [&hellip;]<\/p>\n","protected":false},"author":8,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-32392","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v21.5 (Yoast SEO v21.5) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>\u4f7f\u7528Nuxt.js\u548cVuetify\u521b\u5efa\u4e00\u4e2aHello World\u9875\u9762 - Blog - Silicon Cloud<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.silicloud.com\/zh\/blog\/\u4f7f\u7528nuxt-js\u548cvuetify\u521b\u5efa\u4e00\u4e2ahello-world\u9875\u9762\u3002-2\/\" \/>\n<meta property=\"og:locale\" content=\"zh_CN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u4f7f\u7528Nuxt.js\u548cVuetify\u521b\u5efa\u4e00\u4e2aHello World\u9875\u9762\" \/>\n<meta property=\"og:description\" content=\"\u6211\u662f\u5408\u540c\u4f1a\u793ekumanote\u7684\u7530\u4e2d\u3002 \u6211\u6700\u8fd1\u901a\u8fc7\u4f7f\u7528Google Drive API\uff0c\u5f00\u53d1\u4e86\u4e00\u4e2a\u8ba9Google [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.silicloud.com\/zh\/blog\/\u4f7f\u7528nuxt-js\u548cvuetify\u521b\u5efa\u4e00\u4e2ahello-world\u9875\u9762\u3002-2\/\" \/>\n<meta property=\"og:site_name\" content=\"Blog - Silicon Cloud\" \/>\n<meta property=\"article:published_time\" content=\"2024-02-07T23:33:01+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-05-04T10:43:25+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/cdn.silicloud.com\/blog-img\/blog\/img\/657d11e337434c4406bf4b6d\/47-0.png\" \/>\n<meta name=\"author\" content=\"\u96c5, \u609f\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u4f5c\u8005\" \/>\n\t<meta name=\"twitter:data1\" content=\"\u96c5, \u609f\" \/>\n\t<meta name=\"twitter:label2\" content=\"\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 \u5206\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/%e4%bd%bf%e7%94%a8nuxt-js%e5%92%8cvuetify%e5%88%9b%e5%bb%ba%e4%b8%80%e4%b8%aahello-world%e9%a1%b5%e9%9d%a2%e3%80%82-2\/\",\"url\":\"https:\/\/www.silicloud.com\/zh\/blog\/%e4%bd%bf%e7%94%a8nuxt-js%e5%92%8cvuetify%e5%88%9b%e5%bb%ba%e4%b8%80%e4%b8%aahello-world%e9%a1%b5%e9%9d%a2%e3%80%82-2\/\",\"name\":\"\u4f7f\u7528Nuxt.js\u548cVuetify\u521b\u5efa\u4e00\u4e2aHello World\u9875\u9762 - Blog - Silicon Cloud\",\"isPartOf\":{\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#website\"},\"datePublished\":\"2024-02-07T23:33:01+00:00\",\"dateModified\":\"2024-05-04T10:43:25+00:00\",\"author\":{\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/f044a4b7fa4ee2701702942002419ca6\"},\"breadcrumb\":{\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/%e4%bd%bf%e7%94%a8nuxt-js%e5%92%8cvuetify%e5%88%9b%e5%bb%ba%e4%b8%80%e4%b8%aahello-world%e9%a1%b5%e9%9d%a2%e3%80%82-2\/#breadcrumb\"},\"inLanguage\":\"zh-Hans\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.silicloud.com\/zh\/blog\/%e4%bd%bf%e7%94%a8nuxt-js%e5%92%8cvuetify%e5%88%9b%e5%bb%ba%e4%b8%80%e4%b8%aahello-world%e9%a1%b5%e9%9d%a2%e3%80%82-2\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/%e4%bd%bf%e7%94%a8nuxt-js%e5%92%8cvuetify%e5%88%9b%e5%bb%ba%e4%b8%80%e4%b8%aahello-world%e9%a1%b5%e9%9d%a2%e3%80%82-2\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"\u9996\u9875\",\"item\":\"https:\/\/www.silicloud.com\/zh\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"\u4f7f\u7528Nuxt.js\u548cVuetify\u521b\u5efa\u4e00\u4e2aHello World\u9875\u9762\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#website\",\"url\":\"https:\/\/www.silicloud.com\/zh\/blog\/\",\"name\":\"Blog - Silicon Cloud\",\"description\":\"\",\"inLanguage\":\"zh-Hans\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/f044a4b7fa4ee2701702942002419ca6\",\"name\":\"\u96c5, \u609f\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-Hans\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/e71a913e914f1aad1efc391f92084294bac54bc782acd289638580134cf667a6?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/e71a913e914f1aad1efc391f92084294bac54bc782acd289638580134cf667a6?s=96&d=mm&r=g\",\"caption\":\"\u96c5, \u609f\"},\"url\":\"https:\/\/www.silicloud.com\/zh\/blog\/author\/yawu\/\"},{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-Hans\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/%e4%bd%bf%e7%94%a8nuxt-js%e5%92%8cvuetify%e5%88%9b%e5%bb%ba%e4%b8%80%e4%b8%aahello-world%e9%a1%b5%e9%9d%a2%e3%80%82-2\/#local-main-organization-logo\",\"url\":\"\",\"contentUrl\":\"\",\"caption\":\"Blog - Silicon Cloud\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"\u4f7f\u7528Nuxt.js\u548cVuetify\u521b\u5efa\u4e00\u4e2aHello World\u9875\u9762 - Blog - Silicon Cloud","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.silicloud.com\/zh\/blog\/\u4f7f\u7528nuxt-js\u548cvuetify\u521b\u5efa\u4e00\u4e2ahello-world\u9875\u9762\u3002-2\/","og_locale":"zh_CN","og_type":"article","og_title":"\u4f7f\u7528Nuxt.js\u548cVuetify\u521b\u5efa\u4e00\u4e2aHello World\u9875\u9762","og_description":"\u6211\u662f\u5408\u540c\u4f1a\u793ekumanote\u7684\u7530\u4e2d\u3002 \u6211\u6700\u8fd1\u901a\u8fc7\u4f7f\u7528Google Drive API\uff0c\u5f00\u53d1\u4e86\u4e00\u4e2a\u8ba9Google [&hellip;]","og_url":"https:\/\/www.silicloud.com\/zh\/blog\/\u4f7f\u7528nuxt-js\u548cvuetify\u521b\u5efa\u4e00\u4e2ahello-world\u9875\u9762\u3002-2\/","og_site_name":"Blog - Silicon Cloud","article_published_time":"2024-02-07T23:33:01+00:00","article_modified_time":"2024-05-04T10:43:25+00:00","og_image":[{"url":"https:\/\/cdn.silicloud.com\/blog-img\/blog\/img\/657d11e337434c4406bf4b6d\/47-0.png"}],"author":"\u96c5, \u609f","twitter_card":"summary_large_image","twitter_misc":{"\u4f5c\u8005":"\u96c5, \u609f","\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4":"2 \u5206"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.silicloud.com\/zh\/blog\/%e4%bd%bf%e7%94%a8nuxt-js%e5%92%8cvuetify%e5%88%9b%e5%bb%ba%e4%b8%80%e4%b8%aahello-world%e9%a1%b5%e9%9d%a2%e3%80%82-2\/","url":"https:\/\/www.silicloud.com\/zh\/blog\/%e4%bd%bf%e7%94%a8nuxt-js%e5%92%8cvuetify%e5%88%9b%e5%bb%ba%e4%b8%80%e4%b8%aahello-world%e9%a1%b5%e9%9d%a2%e3%80%82-2\/","name":"\u4f7f\u7528Nuxt.js\u548cVuetify\u521b\u5efa\u4e00\u4e2aHello World\u9875\u9762 - Blog - Silicon Cloud","isPartOf":{"@id":"https:\/\/www.silicloud.com\/zh\/blog\/#website"},"datePublished":"2024-02-07T23:33:01+00:00","dateModified":"2024-05-04T10:43:25+00:00","author":{"@id":"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/f044a4b7fa4ee2701702942002419ca6"},"breadcrumb":{"@id":"https:\/\/www.silicloud.com\/zh\/blog\/%e4%bd%bf%e7%94%a8nuxt-js%e5%92%8cvuetify%e5%88%9b%e5%bb%ba%e4%b8%80%e4%b8%aahello-world%e9%a1%b5%e9%9d%a2%e3%80%82-2\/#breadcrumb"},"inLanguage":"zh-Hans","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.silicloud.com\/zh\/blog\/%e4%bd%bf%e7%94%a8nuxt-js%e5%92%8cvuetify%e5%88%9b%e5%bb%ba%e4%b8%80%e4%b8%aahello-world%e9%a1%b5%e9%9d%a2%e3%80%82-2\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.silicloud.com\/zh\/blog\/%e4%bd%bf%e7%94%a8nuxt-js%e5%92%8cvuetify%e5%88%9b%e5%bb%ba%e4%b8%80%e4%b8%aahello-world%e9%a1%b5%e9%9d%a2%e3%80%82-2\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"\u9996\u9875","item":"https:\/\/www.silicloud.com\/zh\/blog\/"},{"@type":"ListItem","position":2,"name":"\u4f7f\u7528Nuxt.js\u548cVuetify\u521b\u5efa\u4e00\u4e2aHello World\u9875\u9762"}]},{"@type":"WebSite","@id":"https:\/\/www.silicloud.com\/zh\/blog\/#website","url":"https:\/\/www.silicloud.com\/zh\/blog\/","name":"Blog - Silicon Cloud","description":"","inLanguage":"zh-Hans"},{"@type":"Person","@id":"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/f044a4b7fa4ee2701702942002419ca6","name":"\u96c5, \u609f","image":{"@type":"ImageObject","inLanguage":"zh-Hans","@id":"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/e71a913e914f1aad1efc391f92084294bac54bc782acd289638580134cf667a6?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/e71a913e914f1aad1efc391f92084294bac54bc782acd289638580134cf667a6?s=96&d=mm&r=g","caption":"\u96c5, \u609f"},"url":"https:\/\/www.silicloud.com\/zh\/blog\/author\/yawu\/"},{"@type":"ImageObject","inLanguage":"zh-Hans","@id":"https:\/\/www.silicloud.com\/zh\/blog\/%e4%bd%bf%e7%94%a8nuxt-js%e5%92%8cvuetify%e5%88%9b%e5%bb%ba%e4%b8%80%e4%b8%aahello-world%e9%a1%b5%e9%9d%a2%e3%80%82-2\/#local-main-organization-logo","url":"","contentUrl":"","caption":"Blog - Silicon Cloud"}]}},"_links":{"self":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts\/32392","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/users\/8"}],"replies":[{"embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/comments?post=32392"}],"version-history":[{"count":2,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts\/32392\/revisions"}],"predecessor-version":[{"id":100037,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts\/32392\/revisions\/100037"}],"wp:attachment":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/media?parent=32392"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/categories?post=32392"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/tags?post=32392"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}