From 271a8c8fcaceaa201baed86750059f7858a0332f Mon Sep 17 00:00:00 2001 From: v1xingyue Date: Wed, 22 Nov 2023 09:44:20 +0000 Subject: [PATCH] =?UTF-8?q?Deploying=20to=20gh-pages=20from=20@=20Creators?= =?UTF-8?q?DAO/plasmo-co-learn@1a1559de7e3593be86f8c2a6ce94bcadbd4cb7e4=20?= =?UTF-8?q?=F0=9F=9A=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- 404.html | 4 ++-- assets/js/03e6874b.2086ceda.js | 1 + assets/js/03e6874b.aedb59e0.js | 1 - assets/js/4fbb7b2a.86c86d36.js | 1 + assets/js/4fbb7b2a.cd24a501.js | 1 - assets/js/{78b543d2.86aaf417.js => 78b543d2.21a0ebf4.js} | 2 +- assets/js/935f2afb.3fee8221.js | 1 - assets/js/935f2afb.af6e4ba6.js | 1 + assets/js/runtime~main.3eff7a57.js | 1 - assets/js/runtime~main.7d7ccd24.js | 1 + blog/archive/index.html | 4 ++-- blog/index.html | 4 ++-- blog/mdx-blog-post/index.html | 4 ++-- blog/tags/docusaurus/index.html | 4 ++-- blog/tags/facebook/index.html | 4 ++-- blog/tags/hello/index.html | 4 ++-- blog/tags/index.html | 4 ++-- blog/welcome/index.html | 4 ++-- docs/intro/index.html | 4 ++-- docs/module1/basic_react/index.html | 4 ++-- docs/module1/first-extension/index.html | 4 ++-- docs/module1/index.html | 4 ++-- docs/module1/introduction/index.html | 4 ++-- docs/module2/assets/index.html | 6 +++--- docs/module2/index.html | 6 +++--- docs/module2/pages/index.html | 8 ++++---- docs/module2/sandbox_pages/index.html | 6 +++--- docs/module2/tab_pages/index.html | 6 +++--- docs/module2/workflow/index.html | 8 ++++---- docs/module3/content/index.html | 4 ++-- docs/module3/contentui/index.html | 4 ++-- docs/module3/index.html | 4 ++-- docs/module4/background/index.html | 4 ++-- docs/module4/message/index.html | 4 ++-- docs/module4/remote/index.html | 4 ++-- docs/module4/storage/index.html | 4 ++-- index.html | 4 ++-- markdown-page/index.html | 4 ++-- 38 files changed, 71 insertions(+), 71 deletions(-) create mode 100644 assets/js/03e6874b.2086ceda.js delete mode 100644 assets/js/03e6874b.aedb59e0.js create mode 100644 assets/js/4fbb7b2a.86c86d36.js delete mode 100644 assets/js/4fbb7b2a.cd24a501.js rename assets/js/{78b543d2.86aaf417.js => 78b543d2.21a0ebf4.js} (86%) delete mode 100644 assets/js/935f2afb.3fee8221.js create mode 100644 assets/js/935f2afb.af6e4ba6.js delete mode 100644 assets/js/runtime~main.3eff7a57.js create mode 100644 assets/js/runtime~main.7d7ccd24.js diff --git a/404.html b/404.html index 1be78e3..9b27bce 100644 --- a/404.html +++ b/404.html @@ -5,13 +5,13 @@ 找不到页面 | Plasmo-Co-Learn - +
跳到主要内容

找不到页面

我们找不到您要找的页面。

请联系原始链接来源网站的所有者,并告知他们链接已损坏。

- + \ No newline at end of file diff --git a/assets/js/03e6874b.2086ceda.js b/assets/js/03e6874b.2086ceda.js new file mode 100644 index 0000000..08f3daf --- /dev/null +++ b/assets/js/03e6874b.2086ceda.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkplasmo_co_learn=self.webpackChunkplasmo_co_learn||[]).push([[9906],{3905:(e,t,n)=>{n.d(t,{Zo:()=>m,kt:()=>k});var a=n(7294);function l(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function r(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,a)}return n}function o(e){for(var t=1;t=0||(l[n]=e[n]);return l}(e,t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);for(a=0;a=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(l[n]=e[n])}return l}var s=a.createContext({}),i=function(e){var t=a.useContext(s),n=t;return e&&(n="function"==typeof e?e(t):o(o({},t),e)),n},m=function(e){var t=i(e.components);return a.createElement(s.Provider,{value:t},e.children)},c="mdxType",d={inlineCode:"code",wrapper:function(e){var t=e.children;return a.createElement(a.Fragment,{},t)}},u=a.forwardRef((function(e,t){var n=e.components,l=e.mdxType,r=e.originalType,s=e.parentName,m=p(e,["components","mdxType","originalType","parentName"]),c=i(n),u=l,k=c["".concat(s,".").concat(u)]||c[u]||d[u]||r;return n?a.createElement(k,o(o({ref:t},m),{},{components:n})):a.createElement(k,o({ref:t},m))}));function k(e,t){var n=arguments,l=t&&t.mdxType;if("string"==typeof e||l){var r=n.length,o=new Array(r);o[0]=u;var p={};for(var s in t)hasOwnProperty.call(t,s)&&(p[s]=t[s]);p.originalType=e,p[c]="string"==typeof e?e:l,o[1]=p;for(var i=2;i{n.r(t),n.d(t,{assets:()=>s,contentTitle:()=>o,default:()=>d,frontMatter:()=>r,metadata:()=>p,toc:()=>i});var a=n(7462),l=(n(7294),n(3905));const r={sidebar_position:3},o="\u5f00\u53d1\u5de5\u4f5c\u6d41",p={unversionedId:"module2/workflow",id:"module2/workflow",title:"\u5f00\u53d1\u5de5\u4f5c\u6d41",description:"\u8fd9\u91cc\u4e3b\u8981\u4ecb\u7ecd\u4f7f\u7528 plasmo \u5f00\u53d1\u6d4f\u89c8\u5668\u6269\u5c55\u7684\u5de5\u4f5c\u6d41\u3002",source:"@site/docs/module2/workflow.mdx",sourceDirName:"module2",slug:"/module2/workflow",permalink:"/plasmo-co-learn/docs/module2/workflow",draft:!1,editUrl:"https://github.com/CreatorsDAO/plasmo-co-learn/tree/main/docs/module2/workflow.mdx",tags:[],version:"current",sidebarPosition:3,frontMatter:{sidebar_position:3},sidebar:"tutorialSidebar",previous:{title:"\u6a21\u5757\u4ecb\u7ecd",permalink:"/plasmo-co-learn/docs/module2/"},next:{title:"\u6269\u5c55\u5185\u7f6e\u9875\u9762",permalink:"/plasmo-co-learn/docs/module2/pages"}},s={},i=[{value:"\u521b\u5efa\u9879\u76ee",id:"\u521b\u5efa\u9879\u76ee",level:2},{value:"\u4f7f\u7528 src \u4f5c\u4e3a\u6e90\u7801\u76ee\u5f55",id:"\u4f7f\u7528-src-\u4f5c\u4e3a\u6e90\u7801\u76ee\u5f55",level:3},{value:"\u6307\u5b9a\u5165\u53e3\u6587\u4ef6",id:"\u6307\u5b9a\u5165\u53e3\u6587\u4ef6",level:3},{value:"\u4f7f\u7528\u6a21\u677f\u6587\u4ef6",id:"\u4f7f\u7528\u6a21\u677f\u6587\u4ef6",level:3},{value:"Development Sever",id:"development-sever",level:2},{value:"\u52a0\u8f7d\u6269\u5c55",id:"\u52a0\u8f7d\u6269\u5c55",level:3},{value:"\u9009\u62e9\u4e00\u4e2a\u6307\u5b9a\u7684\u76ee\u6807\u6587\u4ef6",id:"\u9009\u62e9\u4e00\u4e2a\u6307\u5b9a\u7684\u76ee\u6807\u6587\u4ef6",level:3},{value:"\u53bb\u6389 source maps",id:"\u53bb\u6389-source-maps",level:3},{value:"\u6307\u5b9a Server port \u548c websocket",id:"\u6307\u5b9a-server-port-\u548c-websocket",level:3},{value:"\u53d1\u5e03\u4e00\u4e2a\u4ea7\u54c1\u5305",id:"\u53d1\u5e03\u4e00\u4e2a\u4ea7\u54c1\u5305",level:2},{value:"\u5e38\u89c4\u7684 build",id:"\u5e38\u89c4\u7684-build",level:3},{value:"\u8bbe\u7f6e\u76ee\u6807",id:"\u8bbe\u7f6e\u76ee\u6807",level:3},{value:"\u6dfb\u52a0\u81ea\u5b9a\u4e49 tag",id:"\u6dfb\u52a0\u81ea\u5b9a\u4e49-tag",level:3},{value:"\u53bb\u6389 source maps",id:"\u53bb\u6389-source-maps-1",level:3},{value:"\u5176\u4ed6\u4f18\u5316",id:"\u5176\u4ed6\u4f18\u5316",level:3}],m={toc:i},c="wrapper";function d(e){let{components:t,...r}=e;return(0,l.kt)(c,(0,a.Z)({},m,r,{components:t,mdxType:"MDXLayout"}),(0,l.kt)("h1",{id:"\u5f00\u53d1\u5de5\u4f5c\u6d41"},"\u5f00\u53d1\u5de5\u4f5c\u6d41"),(0,l.kt)("p",null,"\u8fd9\u91cc\u4e3b\u8981\u4ecb\u7ecd\u4f7f\u7528 ",(0,l.kt)("inlineCode",{parentName:"p"},"plasmo")," \u5f00\u53d1\u6d4f\u89c8\u5668\u6269\u5c55\u7684\u5de5\u4f5c\u6d41\u3002"),(0,l.kt)("h2",{id:"\u521b\u5efa\u9879\u76ee"},"\u521b\u5efa\u9879\u76ee"),(0,l.kt)("p",null,"\u901a\u8fc7\u5982\u4e0b\u7684\u547d\u4ee4\u521b\u5efa ",(0,l.kt)("inlineCode",{parentName:"p"},"plasmo")," \u9879\u76ee\uff1a"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"pnpm create plasmo\n# OR\nyarn create plasmo\n# OR\nnpm create plasmo\n")),(0,l.kt)("p",null,"\u5982\u679c\uff0c\u8df3\u8fc7\u540d\u5b57\u7684\u63d0\u793a\uff0c\u6dfb\u52a0\u4e00\u4e2a\u6269\u5c55\u7684\u540d\u5b57\u5373\u53ef:"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},'pnpm create plasmo "My Awesome Extension"\n# OR\nyarn create plasmo "My Awesome Extension"\n# OR\nnpm create plasmo "My Awesome Extension"\n')),(0,l.kt)("admonition",{type:"tip"},(0,l.kt)("p",{parentName:"admonition"},"\u4f60\u4e5f\u53ef\u4ee5\u628a ",(0,l.kt)("inlineCode",{parentName:"p"},"plasmo")," \u5b89\u88c5\u4e3a\u5168\u5c40\u7684\u5bf9\u8c61 ",(0,l.kt)("inlineCode",{parentName:"p"},"pnpm i -g plasmo"),"\u3002")),(0,l.kt)("h3",{id:"\u4f7f\u7528-src-\u4f5c\u4e3a\u6e90\u7801\u76ee\u5f55"},"\u4f7f\u7528 ",(0,l.kt)("inlineCode",{parentName:"h3"},"src")," \u4f5c\u4e3a\u6e90\u7801\u76ee\u5f55"),(0,l.kt)("p",null,"\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c",(0,l.kt)("inlineCode",{parentName:"p"},"plasmo")," \u4f7f\u7528\u5f53\u524d\u9879\u76ee\u7684\u6587\u4ef6\u5939\u4f5c\u4e3a\u4ee3\u7801\u6839\u76ee\u5f55\u3002 \u521b\u5efa\u9879\u76ee\u7684\u65f6\u5019\uff0c\u4f7f\u7528 --with-src \u53c2\u6570\u5373\u53ef"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"pnpm create plasmo --with-src\n# OR\nyarn create plasmo --with-src\n# OR\nnpm create plasmo --with-src\n")),(0,l.kt)("p",null,"\u5982\u679c\u4f60\u7684\u9879\u76ee\u5df2\u7ecf\u521b\u5efa\u597d\u4e86\uff0c\u8bf7\u6309\u7167\u5982\u4e0b\u7684\u64cd\u4f5c:"),(0,l.kt)("ol",null,(0,l.kt)("li",{parentName:"ol"},"\u628a\u6240\u6709\u7684\u6e90\u7801\u590d\u5236\u5230 ",(0,l.kt)("inlineCode",{parentName:"li"},"src")," \u76ee\u5f55\u3002\n\u7136\u540e\u4fee\u6539 ",(0,l.kt)("inlineCode",{parentName:"li"},"tsconfig.json")," \uff1a \u539f\u6765\u6307\u5411 ",(0,l.kt)("inlineCode",{parentName:"li"},"~*")," \uff0c\u6539\u4e3a ",(0,l.kt)("inlineCode",{parentName:"li"},"./src/*")),(0,l.kt)("li",{parentName:"ol"},"\u4fee\u6539 \u914d\u7f6e\u6587\u4ef6\u6e90\u7801\u90e8\u5206:")),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},'{\n "extends": "plasmo/templates/tsconfig.base",\n "exclude": ["node_modules"],\n "include": [".plasmo/index.d.ts", "./**/*.ts", "./**/*.tsx"],\n "compilerOptions": {\n "paths": {\n "~*": ["./src/*"]\n },\n "baseUrl": "."\n }\n}\n')),(0,l.kt)("h3",{id:"\u6307\u5b9a\u5165\u53e3\u6587\u4ef6"},"\u6307\u5b9a\u5165\u53e3\u6587\u4ef6"),(0,l.kt)("p",null,"\u9ed8\u8ba4\u7684\u5165\u53e3\u6587\u4ef6\u4e3a ",(0,l.kt)("a",{parentName:"p",href:"https://docs.plasmo.com/framework/ext-pages#adding-a-popup-page"},"popup"),"\u3002\n\u4f60\u53ef\u4ee5\u4f7f\u7528 --entry \u8bbe\u7f6e\u4e0d\u540c\u7684\u5165\u53e3\u3002\n\u8fd9\u91cc\u5217\u51fa\u4e86",(0,l.kt)("inlineCode",{parentName:"p"},"plasmo")," \u652f\u6301\u7684 ",(0,l.kt)("a",{parentName:"p",href:"https://github.com/PlasmoHQ/plasmo/tree/main/packages/init/entries"},"entries"),"\u3002"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"pnpm create plasmo --entry=options,newtab,contents/inline\n# OR\nnpm create plasmo -- --entry=options,newtab,contents/inline\n")),(0,l.kt)("admonition",{type:"tip"},(0,l.kt)("p",{parentName:"admonition"},"npm \u4e0d\u652f\u6301 \u5411\u4ed6\u7684\u5b50\u547d\u4ee4\u76f4\u63a5\u4f20\u9012\u53c2\u6570\uff0c\u9700\u8981\u4f7f\u7528 -- \u8f6c\u79fb\u4f20\u9012\u7684\u53c2\u6570\u3002")),(0,l.kt)("h3",{id:"\u4f7f\u7528\u6a21\u677f\u6587\u4ef6"},"\u4f7f\u7528\u6a21\u677f\u6587\u4ef6"),(0,l.kt)("p",null,"plasmo \u5b98\u65b9\u63d0\u4f9b\u4e86\u4e00\u4e2a ",(0,l.kt)("a",{parentName:"p",href:"https://github.com/PlasmoHQ/examples/"},"\u6a21\u677f\u5217\u8868"),"\u3002\u53ef\u4ee5\u9009\u62e9\u4e0d\u540c\u7684\u6a21\u677f\u7c7b\u578b\u521d\u59cb\u5316:"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"pnpm create plasmo --with-env\n# OR\nnpm create plasmo -- --with-env\n")),(0,l.kt)("h2",{id:"development-sever"},"Development Sever"),(0,l.kt)("p",null,"\u4f7f\u7528\u5982\u4e0b\u7684\u547d\u4ee4\u542f\u52a8"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"pnpm dev\n# OR\nnpm run dev\n# OR\nplasmo dev\n")),(0,l.kt)("p",null,(0,l.kt)("inlineCode",{parentName:"p"},"Plasmo")," \u5c06\u4e3a\u60a8\u7684\u6269\u5c55\u521b\u5efa\u4e00\u4e2a\u5f00\u53d1\u6587\u4ef6\u5939\u548c\u4e00\u4e2a\u5b9e\u65f6\u91cd\u8f7d\u5f00\u53d1\u670d\u52a1\u5668(\u4e00\u4e2a websocket \u670d\u52a1\u5668)\uff0c\u6587\u4ef6\u66f4\u6539\u65f6\u81ea\u52a8\u66f4\u65b0\u60a8\u7684\u5f00\u53d1\u6587\u4ef6\u5939\u3002\n\u66f4\u65b9\u4fbf\u7684\u662f\u5f53\u4f60\u4fee\u6539\u6e90\u4ee3\u7801\u66f4\u6539\u65f6\u91cd\u65b0\u52a0\u8f7d\u6d4f\u89c8\u5668\u3002\n\u5b83\u8fd8\u4f1a\u5728\u6269\u5c55\u540d\u524d\u52a0\u4e0a DEV | \u5e76\u4f7f\u56fe\u6807\u53d8\u6210\u7070\u5ea6\uff0c\u4ee5\u533a\u5206\u5f00\u53d1\u548c\u751f\u4ea7\u6269\u5c55\u6346\u7ed1\u5305\u3002"),(0,l.kt)("h3",{id:"\u52a0\u8f7d\u6269\u5c55"},"\u52a0\u8f7d\u6269\u5c55"),(0,l.kt)("p",null,"\u4f7f\u7528 ",(0,l.kt)("inlineCode",{parentName:"p"},"chrome://extensions")," \u6253\u5f00\u8bbe\u7f6e\u9875\u9762\u542f\u7528\u5f00\u53d1\u8005\u6a21\u5f0f\u3002"),(0,l.kt)("p",null,(0,l.kt)("img",{alt:"dev mode",src:n(9027).Z,width:"690",height:"624"})),(0,l.kt)("p",null,"\u70b9\u51fb\u9875\u9762 ",(0,l.kt)("inlineCode",{parentName:"p"},"\u52a0\u8f7d\u5df2\u89e3\u538b\u7684\u6269\u5c55\u7a0b\u5e8f")," \u9009\u9879\uff0c\u5728\u5f39\u51fa\u7684\u6587\u4ef6\u5bfc\u822a\u4e2d\u5b9a\u4f4d\u5230\u9879\u76ee\u7684\u5f00\u53d1\u76ee\u5f55\u4e2d\u7684",(0,l.kt)("inlineCode",{parentName:"p"},"build"),"\u6587\u4ef6\u5939\u3002"),(0,l.kt)("p",null,"\u5176\u4e2d\u53ef\u80fd\u6709\u4e24\u4e2a\u6587\u4ef6\u5939:"),(0,l.kt)("ol",null,(0,l.kt)("li",{parentName:"ol"},(0,l.kt)("inlineCode",{parentName:"li"},"chrome-mv3-dev")," \u4e3a\u5f00\u53d1\u76ee\u5f55\uff0c\u4e3a\u5f00\u53d1\u8fc7\u7a0b\u4e2d\u4f7f\u7528\u7684\u76ee\u5f55\u3002 ",(0,l.kt)("inlineCode",{parentName:"li"},"run dev")," \u7684\u65f6\u5019\u4f1a\u540c\u65f6\u89e6\u53d1\u4e00\u4e2a\u548c\u9875\u9762\u8fde\u63a5\u7684 websocket,\u66f4\u65b0\u6269\u5c55\u7684\u65f6\u5019\uff0c\u9664\u4e86\u4f1a\u91cd\u65b0\u6253\u5305\u6269\u5c55\u4ee5\u5916\u3002\n\u9875\u9762\u4e5f\u4f1a\u6709\u6240\u53cd\u9988\u3002"),(0,l.kt)("li",{parentName:"ol"},(0,l.kt)("inlineCode",{parentName:"li"},"chrome-mv3-prod")," \u8fd9\u91cc\u4e3a\u4ea7\u54c1\u76ee\u5f55\uff0c\u4e0e\u7ebf\u4e0a\u53d1\u5e03\u540e\u7684\u771f\u5b9e\u60c5\u51b5\u6ca1\u6709\u533a\u522b\uff0c\u4e5f\u53ef\u4ee5\u5c0f\u8303\u56f4\u4f7f\u7528\u5206\u53d1\u6d4b\u8bd5\u3002")),(0,l.kt)("admonition",{type:"tip"},(0,l.kt)("p",{parentName:"admonition"},"\u6709\u65f6\u4f60\u65e0\u6cd5\u5728 chrome \u4e2d\u770b\u5230\u4f60\u7684\u6269\u5c55\u3002\u5728 chrome \u5bfc\u822a\u680f\u7684\u8bbe\u7f6e\u4e2d\u70b9\u5f00\uff0c\u9009\u62e9 Pin \u5373\u53ef\u663e\u793a\u51fa\u6765\u3002\n",(0,l.kt)("img",{alt:"dev mode",src:n(1622).Z,width:"495",height:"641"}))),(0,l.kt)("h3",{id:"\u9009\u62e9\u4e00\u4e2a\u6307\u5b9a\u7684\u76ee\u6807\u6587\u4ef6"},"\u9009\u62e9\u4e00\u4e2a\u6307\u5b9a\u7684\u76ee\u6807\u6587\u4ef6"),(0,l.kt)("p",null,"\u6211\u4eec\u4f7f\u7528 ",(0,l.kt)("inlineCode",{parentName:"p"},"plasmo")," \u5f00\u53d1\u6846\u67b6\uff0c\u4e0d\u53ea\u662f\u4e00\u4e2a Chrome \u6269\u5c55\u6216\u8005 Firefox \u6269\u5c55\u3002 \u4ed6\u5e94\u8be5\u79f0\u4e4b\u4e3a ",(0,l.kt)("inlineCode",{parentName:"p"},"plasmo"),"\u6269\u5c55\u3002\n\u8fd9\u4e5f\u610f\u5473\u7740\uff0c\u4f60\u53ef\u4ee5\u4f60\u53ef\u4ee5\u6253\u5305\u51fa\u6240\u6709\u652f\u6301\u7684\u6d4f\u89c8\u5668\u3002\u4f60\u53ef\u4ee5\u4f7f\u7528 ",(0,l.kt)("inlineCode",{parentName:"p"},"--target")," \u53c2\u6570\u6765\u5236\u5b9a\u3002"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"plasmo dev --target=firefox-mv2\n")),(0,l.kt)("p",null,(0,l.kt)("a",{parentName:"p",href:"https://docs.plasmo.com/framework/workflows/faq#what-are-the-officially-supported-browser-targets"},"\u652f\u6301\u7684\u76ee\u6807\u6d4f\u89c8\u5668\u5217\u8868")),(0,l.kt)("h3",{id:"\u53bb\u6389-source-maps"},"\u53bb\u6389 ",(0,l.kt)("inlineCode",{parentName:"h3"},"source maps")),(0,l.kt)("p",null,"source maps \u4e3a\u8c03\u5236\u7a0b\u5e8f\u7684\u65f6\u5019\uff0c\u4ed6\u4f1a\u5f71\u54cd\u6269\u5c55\u7684\u52a0\u8f7d\u987a\u5e8f\u3002\u4f7f\u7528 ",(0,l.kt)("inlineCode",{parentName:"p"},"--no-source-maps")," \u53bb\u6389"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"plasmo dev --no-source-maps\n")),(0,l.kt)("h3",{id:"\u6307\u5b9a-server-port-\u548c-websocket"},"\u6307\u5b9a Server port \u548c websocket"),(0,l.kt)("p",null,"\u6309\u7167\u5982\u4e0b\u7684\u547d\u4ee4\u4fee\u6539 \u542f\u52a8\u7684 Server port \u548c websocket \u7aef\u53e3"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"plasmo dev --serve-host=localhost --serve-port-1012\nplasmo dev --hmr-host=localhost --hmr-port=1815\n")),(0,l.kt)("h2",{id:"\u53d1\u5e03\u4e00\u4e2a\u4ea7\u54c1\u5305"},"\u53d1\u5e03\u4e00\u4e2a\u4ea7\u54c1\u5305"),(0,l.kt)("h3",{id:"\u5e38\u89c4\u7684-build"},"\u5e38\u89c4\u7684 ",(0,l.kt)("inlineCode",{parentName:"h3"},"build")),(0,l.kt)("p",null,"\u4ea7\u54c1\u5305 ",(0,l.kt)("inlineCode",{parentName:"p"},"build")," \u547d\u4ee4"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"pnpm build\n# OR\nnpm run build\n")),(0,l.kt)("p",null,"\u751f\u6210 zip \u5305"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"pnpm package\n# OR\nnpm run package\n")),(0,l.kt)("p",null,"\u4ee5\u4e0a\u4e24\u6b65\u4e5f\u53ef\u4ee5\u5408\u6210\u4e00\u6b65"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"pnpm build --zip\n# OR\nnpm run build -- --zip\n")),(0,l.kt)("h3",{id:"\u8bbe\u7f6e\u76ee\u6807"},"\u8bbe\u7f6e\u76ee\u6807"),(0,l.kt)("p",null,"\u540c dev \u4e00\u6837\uff0c\u4f60\u53ef\u4ee5\u4f7f\u7528 ",(0,l.kt)("inlineCode",{parentName:"p"},"--target")," \u8bbe\u7f6e\u76ee\u6807"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"plasmo build --target=firefox-mv2\n")),(0,l.kt)("p",null,(0,l.kt)("a",{parentName:"p",href:"https://docs.plasmo.com/framework/workflows/faq#what-are-the-officially-supported-browser-targets"},"\u652f\u6301\u5217\u8868")),(0,l.kt)("h3",{id:"\u6dfb\u52a0\u81ea\u5b9a\u4e49-tag"},"\u6dfb\u52a0\u81ea\u5b9a\u4e49 tag"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"plasmo build --tag=staging\n")),(0,l.kt)("p",null,"\u5c06\u4f1a\u751f\u6210 ",(0,l.kt)("inlineCode",{parentName:"p"},"build/chrome-mv3-staging")," \u76ee\u5f55\u3002"),(0,l.kt)("h3",{id:"\u53bb\u6389-source-maps-1"},"\u53bb\u6389 source maps"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"plasmo build --source-maps\n")),(0,l.kt)("h3",{id:"\u5176\u4ed6\u4f18\u5316"},"\u5176\u4ed6\u4f18\u5316"),(0,l.kt)("p",null,"\u5173\u95ed minification (\u4e00\u79cd\u4ee3\u7801\u538b\u7f29\u6280\u672f)"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"plasmo build --no-minify\n")),(0,l.kt)("p",null,"\u542f\u7528 ",(0,l.kt)("inlineCode",{parentName:"p"},"hoisting")," \u7684\u6280\u672f\u3002\n\u5728 JavaScript \u548c\u6d4f\u89c8\u5668\u6269\u5c55\u5f00\u53d1\u4e2d\uff0choisting \u6307\u7684\u662f\u63d0\u5347\u6a21\u5757\u4f9d\u8d56\u9879\u7684\u8fc7\u7a0b\uff0c\u4f7f\u5f97\u88ab\u591a\u4e2a\u6587\u4ef6\u5171\u540c\u4f9d\u8d56\u7684\u6a21\u5757\u53ea\u9700\u8981\u52a0\u8f7d\u4e00\u6b21\u3002"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"plasmo build --hoist\n")),(0,l.kt)("p",null,"\u4ee5\u4e0a\u7684\u4e24\u4e2a\u53c2\u6570\uff0c\u53ef\u4ee5\u7ec4\u5408\u4f7f\u7528\u3002"))}d.isMDXComponent=!0},9027:(e,t,n)=>{n.d(t,{Z:()=>a});const a=n.p+"assets/images/devmod-0154a12bc307a9ff9eed9d1959254249.jpg"},1622:(e,t,n)=>{n.d(t,{Z:()=>a});const a=n.p+"assets/images/show_extension-2ff6d404b47d0c027ee3105fe0104d5a.jpg"}}]); \ No newline at end of file diff --git a/assets/js/03e6874b.aedb59e0.js b/assets/js/03e6874b.aedb59e0.js deleted file mode 100644 index 4d7fe14..0000000 --- a/assets/js/03e6874b.aedb59e0.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkplasmo_co_learn=self.webpackChunkplasmo_co_learn||[]).push([[9906],{3905:(e,t,n)=>{n.d(t,{Zo:()=>m,kt:()=>k});var a=n(7294);function l(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function r(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,a)}return n}function o(e){for(var t=1;t=0||(l[n]=e[n]);return l}(e,t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);for(a=0;a=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(l[n]=e[n])}return l}var s=a.createContext({}),i=function(e){var t=a.useContext(s),n=t;return e&&(n="function"==typeof e?e(t):o(o({},t),e)),n},m=function(e){var t=i(e.components);return a.createElement(s.Provider,{value:t},e.children)},c="mdxType",d={inlineCode:"code",wrapper:function(e){var t=e.children;return a.createElement(a.Fragment,{},t)}},u=a.forwardRef((function(e,t){var n=e.components,l=e.mdxType,r=e.originalType,s=e.parentName,m=p(e,["components","mdxType","originalType","parentName"]),c=i(n),u=l,k=c["".concat(s,".").concat(u)]||c[u]||d[u]||r;return n?a.createElement(k,o(o({ref:t},m),{},{components:n})):a.createElement(k,o({ref:t},m))}));function k(e,t){var n=arguments,l=t&&t.mdxType;if("string"==typeof e||l){var r=n.length,o=new Array(r);o[0]=u;var p={};for(var s in t)hasOwnProperty.call(t,s)&&(p[s]=t[s]);p.originalType=e,p[c]="string"==typeof e?e:l,o[1]=p;for(var i=2;i{n.r(t),n.d(t,{assets:()=>s,contentTitle:()=>o,default:()=>d,frontMatter:()=>r,metadata:()=>p,toc:()=>i});var a=n(7462),l=(n(7294),n(3905));const r={sidebar_position:3},o="\u5f00\u53d1\u5de5\u4f5c\u6d41",p={unversionedId:"module2/workflow",id:"module2/workflow",title:"\u5f00\u53d1\u5de5\u4f5c\u6d41",description:"\u8fd9\u91cc\u4e3b\u8981\u4ecb\u7ecd\u4f7f\u7528 plasmo \u5f00\u53d1\u6d4f\u89c8\u5668\u6269\u5c55\u7684\u5de5\u4f5c\u6d41\u3002",source:"@site/docs/module2/workflow.mdx",sourceDirName:"module2",slug:"/module2/workflow",permalink:"/plasmo-co-learn/docs/module2/workflow",draft:!1,editUrl:"https://github.com/CreatorsDAO/plasmo-co-learn/tree/main/docs/module2/workflow.mdx",tags:[],version:"current",sidebarPosition:3,frontMatter:{sidebar_position:3},sidebar:"tutorialSidebar",previous:{title:"\u6a21\u5757\u4ecb\u7ecd",permalink:"/plasmo-co-learn/docs/module2/"},next:{title:"\u6d4f\u89c8\u5668\u5185\u7f6e\u9875\u9762",permalink:"/plasmo-co-learn/docs/module2/pages"}},s={},i=[{value:"\u521b\u5efa\u9879\u76ee",id:"\u521b\u5efa\u9879\u76ee",level:2},{value:"\u4f7f\u7528 src \u4f5c\u4e3a\u6e90\u7801\u76ee\u5f55",id:"\u4f7f\u7528-src-\u4f5c\u4e3a\u6e90\u7801\u76ee\u5f55",level:3},{value:"\u6307\u5b9a\u5165\u53e3\u6587\u4ef6",id:"\u6307\u5b9a\u5165\u53e3\u6587\u4ef6",level:3},{value:"\u4f7f\u7528\u6a21\u677f\u6587\u4ef6",id:"\u4f7f\u7528\u6a21\u677f\u6587\u4ef6",level:3},{value:"Development Sever",id:"development-sever",level:2},{value:"\u52a0\u8f7d\u6269\u5c55",id:"\u52a0\u8f7d\u6269\u5c55",level:3},{value:"\u9009\u62e9\u4e00\u4e2a\u6307\u5b9a\u7684\u76ee\u6807\u6587\u4ef6",id:"\u9009\u62e9\u4e00\u4e2a\u6307\u5b9a\u7684\u76ee\u6807\u6587\u4ef6",level:3},{value:"\u53bb\u6389 source maps",id:"\u53bb\u6389-source-maps",level:3},{value:"\u6307\u5b9a Server port \u548c websocket",id:"\u6307\u5b9a-server-port-\u548c-websocket",level:3},{value:"\u53d1\u5e03\u4e00\u4e2a\u4ea7\u54c1\u5305",id:"\u53d1\u5e03\u4e00\u4e2a\u4ea7\u54c1\u5305",level:2},{value:"\u5e38\u89c4\u7684 build",id:"\u5e38\u89c4\u7684-build",level:3},{value:"\u8bbe\u7f6e\u76ee\u6807",id:"\u8bbe\u7f6e\u76ee\u6807",level:3},{value:"\u6dfb\u52a0\u81ea\u5b9a\u4e49 tag",id:"\u6dfb\u52a0\u81ea\u5b9a\u4e49-tag",level:3},{value:"\u53bb\u6389 source maps",id:"\u53bb\u6389-source-maps-1",level:3},{value:"\u5176\u4ed6\u4f18\u5316",id:"\u5176\u4ed6\u4f18\u5316",level:3}],m={toc:i},c="wrapper";function d(e){let{components:t,...r}=e;return(0,l.kt)(c,(0,a.Z)({},m,r,{components:t,mdxType:"MDXLayout"}),(0,l.kt)("h1",{id:"\u5f00\u53d1\u5de5\u4f5c\u6d41"},"\u5f00\u53d1\u5de5\u4f5c\u6d41"),(0,l.kt)("p",null,"\u8fd9\u91cc\u4e3b\u8981\u4ecb\u7ecd\u4f7f\u7528 ",(0,l.kt)("inlineCode",{parentName:"p"},"plasmo")," \u5f00\u53d1\u6d4f\u89c8\u5668\u6269\u5c55\u7684\u5de5\u4f5c\u6d41\u3002"),(0,l.kt)("h2",{id:"\u521b\u5efa\u9879\u76ee"},"\u521b\u5efa\u9879\u76ee"),(0,l.kt)("p",null,"\u901a\u8fc7\u5982\u4e0b\u7684\u547d\u4ee4\u521b\u5efa ",(0,l.kt)("inlineCode",{parentName:"p"},"plasmo")," \u9879\u76ee\uff1a"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"pnpm create plasmo\n# OR\nyarn create plasmo\n# OR\nnpm create plasmo\n")),(0,l.kt)("p",null,"\u5982\u679c\uff0c\u8df3\u8fc7\u540d\u5b57\u7684\u63d0\u793a\uff0c\u6dfb\u52a0\u4e00\u4e2a\u6269\u5c55\u7684\u540d\u5b57\u5373\u53ef:"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},'pnpm create plasmo "My Awesome Extension"\n# OR\nyarn create plasmo "My Awesome Extension"\n# OR\nnpm create plasmo "My Awesome Extension"\n')),(0,l.kt)("admonition",{type:"tip"},(0,l.kt)("p",{parentName:"admonition"},"\u4f60\u4e5f\u53ef\u4ee5\u628a ",(0,l.kt)("inlineCode",{parentName:"p"},"plasmo")," \u5b89\u88c5\u4e3a\u5168\u5c40\u7684\u5bf9\u8c61 ",(0,l.kt)("inlineCode",{parentName:"p"},"pnpm i -g plasmo"),"\u3002")),(0,l.kt)("h3",{id:"\u4f7f\u7528-src-\u4f5c\u4e3a\u6e90\u7801\u76ee\u5f55"},"\u4f7f\u7528 ",(0,l.kt)("inlineCode",{parentName:"h3"},"src")," \u4f5c\u4e3a\u6e90\u7801\u76ee\u5f55"),(0,l.kt)("p",null,"\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c",(0,l.kt)("inlineCode",{parentName:"p"},"plasmo")," \u4f7f\u7528\u5f53\u524d\u9879\u76ee\u7684\u6587\u4ef6\u5939\u4f5c\u4e3a\u4ee3\u7801\u6839\u76ee\u5f55\u3002 \u521b\u5efa\u9879\u76ee\u7684\u65f6\u5019\uff0c\u4f7f\u7528 --with-src \u53c2\u6570\u5373\u53ef"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"pnpm create plasmo --with-src\n# OR\nyarn create plasmo --with-src\n# OR\nnpm create plasmo --with-src\n")),(0,l.kt)("p",null,"\u5982\u679c\u4f60\u7684\u9879\u76ee\u5df2\u7ecf\u521b\u5efa\u597d\u4e86\uff0c\u8bf7\u6309\u7167\u5982\u4e0b\u7684\u64cd\u4f5c:"),(0,l.kt)("ol",null,(0,l.kt)("li",{parentName:"ol"},"\u628a\u6240\u6709\u7684\u6e90\u7801\u590d\u5236\u5230 ",(0,l.kt)("inlineCode",{parentName:"li"},"src")," \u76ee\u5f55\u3002\n\u7136\u540e\u4fee\u6539 ",(0,l.kt)("inlineCode",{parentName:"li"},"tsconfig.json")," \uff1a \u539f\u6765\u6307\u5411 ",(0,l.kt)("inlineCode",{parentName:"li"},"~*")," \uff0c\u6539\u4e3a ",(0,l.kt)("inlineCode",{parentName:"li"},"./src/*")),(0,l.kt)("li",{parentName:"ol"},"\u4fee\u6539 \u914d\u7f6e\u6587\u4ef6\u6e90\u7801\u90e8\u5206:")),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},'{\n "extends": "plasmo/templates/tsconfig.base",\n "exclude": ["node_modules"],\n "include": [".plasmo/index.d.ts", "./**/*.ts", "./**/*.tsx"],\n "compilerOptions": {\n "paths": {\n "~*": ["./src/*"]\n },\n "baseUrl": "."\n }\n}\n')),(0,l.kt)("h3",{id:"\u6307\u5b9a\u5165\u53e3\u6587\u4ef6"},"\u6307\u5b9a\u5165\u53e3\u6587\u4ef6"),(0,l.kt)("p",null,"\u9ed8\u8ba4\u7684\u5165\u53e3\u6587\u4ef6\u4e3a ",(0,l.kt)("a",{parentName:"p",href:"https://docs.plasmo.com/framework/ext-pages#adding-a-popup-page"},"popup"),"\u3002\n\u4f60\u53ef\u4ee5\u4f7f\u7528 --entry \u8bbe\u7f6e\u4e0d\u540c\u7684\u5165\u53e3\u3002\n\u8fd9\u91cc\u5217\u51fa\u4e86",(0,l.kt)("inlineCode",{parentName:"p"},"plasmo")," \u652f\u6301\u7684 ",(0,l.kt)("a",{parentName:"p",href:"https://github.com/PlasmoHQ/plasmo/tree/main/packages/init/entries"},"entries"),"\u3002"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"pnpm create plasmo --entry=options,newtab,contents/inline\n# OR\nnpm create plasmo -- --entry=options,newtab,contents/inline\n")),(0,l.kt)("admonition",{type:"tip"},(0,l.kt)("p",{parentName:"admonition"},"npm \u4e0d\u652f\u6301 \u5411\u4ed6\u7684\u5b50\u547d\u4ee4\u76f4\u63a5\u4f20\u9012\u53c2\u6570\uff0c\u9700\u8981\u4f7f\u7528 -- \u8f6c\u79fb\u4f20\u9012\u7684\u53c2\u6570\u3002")),(0,l.kt)("h3",{id:"\u4f7f\u7528\u6a21\u677f\u6587\u4ef6"},"\u4f7f\u7528\u6a21\u677f\u6587\u4ef6"),(0,l.kt)("p",null,"plasmo \u5b98\u65b9\u63d0\u4f9b\u4e86\u4e00\u4e2a ",(0,l.kt)("a",{parentName:"p",href:"https://github.com/PlasmoHQ/examples/"},"\u6a21\u677f\u5217\u8868"),"\u3002\u53ef\u4ee5\u9009\u62e9\u4e0d\u540c\u7684\u6a21\u677f\u7c7b\u578b\u521d\u59cb\u5316:"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"pnpm create plasmo --with-env\n# OR\nnpm create plasmo -- --with-env\n")),(0,l.kt)("h2",{id:"development-sever"},"Development Sever"),(0,l.kt)("p",null,"\u4f7f\u7528\u5982\u4e0b\u7684\u547d\u4ee4\u542f\u52a8"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"pnpm dev\n# OR\nnpm run dev\n# OR\nplasmo dev\n")),(0,l.kt)("p",null,(0,l.kt)("inlineCode",{parentName:"p"},"Plasmo")," \u5c06\u4e3a\u60a8\u7684\u6269\u5c55\u521b\u5efa\u4e00\u4e2a\u5f00\u53d1\u6587\u4ef6\u5939\u548c\u4e00\u4e2a\u5b9e\u65f6\u91cd\u8f7d\u5f00\u53d1\u670d\u52a1\u5668(\u4e00\u4e2a websocket \u670d\u52a1\u5668)\uff0c\u6587\u4ef6\u66f4\u6539\u65f6\u81ea\u52a8\u66f4\u65b0\u60a8\u7684\u5f00\u53d1\u6587\u4ef6\u5939\u3002\n\u66f4\u65b9\u4fbf\u7684\u662f\u5f53\u4f60\u4fee\u6539\u6e90\u4ee3\u7801\u66f4\u6539\u65f6\u91cd\u65b0\u52a0\u8f7d\u6d4f\u89c8\u5668\u3002\n\u5b83\u8fd8\u4f1a\u5728\u6269\u5c55\u540d\u524d\u52a0\u4e0a DEV | \u5e76\u4f7f\u56fe\u6807\u53d8\u6210\u7070\u5ea6\uff0c\u4ee5\u533a\u5206\u5f00\u53d1\u548c\u751f\u4ea7\u6269\u5c55\u6346\u7ed1\u5305\u3002"),(0,l.kt)("h3",{id:"\u52a0\u8f7d\u6269\u5c55"},"\u52a0\u8f7d\u6269\u5c55"),(0,l.kt)("p",null,"\u4f7f\u7528 ",(0,l.kt)("inlineCode",{parentName:"p"},"chrome://extensions")," \u6253\u5f00\u8bbe\u7f6e\u9875\u9762\u542f\u7528\u5f00\u53d1\u8005\u6a21\u5f0f\u3002"),(0,l.kt)("p",null,(0,l.kt)("img",{alt:"dev mode",src:n(9027).Z,width:"690",height:"624"})),(0,l.kt)("p",null,"\u70b9\u51fb\u9875\u9762 ",(0,l.kt)("inlineCode",{parentName:"p"},"\u52a0\u8f7d\u5df2\u89e3\u538b\u7684\u6269\u5c55\u7a0b\u5e8f")," \u9009\u9879\uff0c\u5728\u5f39\u51fa\u7684\u6587\u4ef6\u5bfc\u822a\u4e2d\u5b9a\u4f4d\u5230\u9879\u76ee\u7684\u5f00\u53d1\u76ee\u5f55\u4e2d\u7684",(0,l.kt)("inlineCode",{parentName:"p"},"build"),"\u6587\u4ef6\u5939\u3002"),(0,l.kt)("p",null,"\u5176\u4e2d\u53ef\u80fd\u6709\u4e24\u4e2a\u6587\u4ef6\u5939:"),(0,l.kt)("ol",null,(0,l.kt)("li",{parentName:"ol"},(0,l.kt)("inlineCode",{parentName:"li"},"chrome-mv3-dev")," \u4e3a\u5f00\u53d1\u76ee\u5f55\uff0c\u4e3a\u5f00\u53d1\u8fc7\u7a0b\u4e2d\u4f7f\u7528\u7684\u76ee\u5f55\u3002 ",(0,l.kt)("inlineCode",{parentName:"li"},"run dev")," \u7684\u65f6\u5019\u4f1a\u540c\u65f6\u89e6\u53d1\u4e00\u4e2a\u548c\u9875\u9762\u8fde\u63a5\u7684 websocket,\u66f4\u65b0\u6269\u5c55\u7684\u65f6\u5019\uff0c\u9664\u4e86\u4f1a\u91cd\u65b0\u6253\u5305\u6269\u5c55\u4ee5\u5916\u3002\n\u9875\u9762\u4e5f\u4f1a\u6709\u6240\u53cd\u9988\u3002"),(0,l.kt)("li",{parentName:"ol"},(0,l.kt)("inlineCode",{parentName:"li"},"chrome-mv3-prod")," \u8fd9\u91cc\u4e3a\u4ea7\u54c1\u76ee\u5f55\uff0c\u4e0e\u7ebf\u4e0a\u53d1\u5e03\u540e\u7684\u771f\u5b9e\u60c5\u51b5\u6ca1\u6709\u533a\u522b\uff0c\u4e5f\u53ef\u4ee5\u5c0f\u8303\u56f4\u4f7f\u7528\u5206\u53d1\u6d4b\u8bd5\u3002")),(0,l.kt)("admonition",{type:"tip"},(0,l.kt)("p",{parentName:"admonition"},"\u6709\u65f6\u4f60\u65e0\u6cd5\u5728 chrome \u4e2d\u770b\u5230\u4f60\u7684\u6269\u5c55\u3002\u5728 chrome \u5bfc\u822a\u680f\u7684\u8bbe\u7f6e\u4e2d\u70b9\u5f00\uff0c\u9009\u62e9 Pin \u5373\u53ef\u663e\u793a\u51fa\u6765\u3002\n",(0,l.kt)("img",{alt:"dev mode",src:n(1622).Z,width:"495",height:"641"}))),(0,l.kt)("h3",{id:"\u9009\u62e9\u4e00\u4e2a\u6307\u5b9a\u7684\u76ee\u6807\u6587\u4ef6"},"\u9009\u62e9\u4e00\u4e2a\u6307\u5b9a\u7684\u76ee\u6807\u6587\u4ef6"),(0,l.kt)("p",null,"\u6211\u4eec\u4f7f\u7528 ",(0,l.kt)("inlineCode",{parentName:"p"},"plasmo")," \u5f00\u53d1\u6846\u67b6\uff0c\u4e0d\u53ea\u662f\u4e00\u4e2a Chrome \u6269\u5c55\u6216\u8005 Firefox \u6269\u5c55\u3002 \u4ed6\u5e94\u8be5\u79f0\u4e4b\u4e3a ",(0,l.kt)("inlineCode",{parentName:"p"},"plasmo"),"\u6269\u5c55\u3002\n\u8fd9\u4e5f\u610f\u5473\u7740\uff0c\u4f60\u53ef\u4ee5\u4f60\u53ef\u4ee5\u6253\u5305\u51fa\u6240\u6709\u652f\u6301\u7684\u6d4f\u89c8\u5668\u3002\u4f60\u53ef\u4ee5\u4f7f\u7528 ",(0,l.kt)("inlineCode",{parentName:"p"},"--target")," \u53c2\u6570\u6765\u5236\u5b9a\u3002"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"plasmo dev --target=firefox-mv2\n")),(0,l.kt)("p",null,(0,l.kt)("a",{parentName:"p",href:"https://docs.plasmo.com/framework/workflows/faq#what-are-the-officially-supported-browser-targets"},"\u652f\u6301\u7684\u76ee\u6807\u6d4f\u89c8\u5668\u5217\u8868")),(0,l.kt)("h3",{id:"\u53bb\u6389-source-maps"},"\u53bb\u6389 ",(0,l.kt)("inlineCode",{parentName:"h3"},"source maps")),(0,l.kt)("p",null,"source maps \u4e3a\u8c03\u5236\u7a0b\u5e8f\u7684\u65f6\u5019\uff0c\u4ed6\u4f1a\u5f71\u54cd\u6269\u5c55\u7684\u52a0\u8f7d\u987a\u5e8f\u3002\u4f7f\u7528 ",(0,l.kt)("inlineCode",{parentName:"p"},"--no-source-maps")," \u53bb\u6389"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"plasmo dev --no-source-maps\n")),(0,l.kt)("h3",{id:"\u6307\u5b9a-server-port-\u548c-websocket"},"\u6307\u5b9a Server port \u548c websocket"),(0,l.kt)("p",null,"\u6309\u7167\u5982\u4e0b\u7684\u547d\u4ee4\u4fee\u6539 \u542f\u52a8\u7684 Server port \u548c websocket \u7aef\u53e3"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"plasmo dev --serve-host=localhost --serve-port-1012\nplasmo dev --hmr-host=localhost --hmr-port=1815\n")),(0,l.kt)("h2",{id:"\u53d1\u5e03\u4e00\u4e2a\u4ea7\u54c1\u5305"},"\u53d1\u5e03\u4e00\u4e2a\u4ea7\u54c1\u5305"),(0,l.kt)("h3",{id:"\u5e38\u89c4\u7684-build"},"\u5e38\u89c4\u7684 ",(0,l.kt)("inlineCode",{parentName:"h3"},"build")),(0,l.kt)("p",null,"\u4ea7\u54c1\u5305 ",(0,l.kt)("inlineCode",{parentName:"p"},"build")," \u547d\u4ee4"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"pnpm build\n# OR\nnpm run build\n")),(0,l.kt)("p",null,"\u751f\u6210 zip \u5305"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"pnpm package\n# OR\nnpm run package\n")),(0,l.kt)("p",null,"\u4ee5\u4e0a\u4e24\u6b65\u4e5f\u53ef\u4ee5\u5408\u6210\u4e00\u6b65"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"pnpm build --zip\n# OR\nnpm run build -- --zip\n")),(0,l.kt)("h3",{id:"\u8bbe\u7f6e\u76ee\u6807"},"\u8bbe\u7f6e\u76ee\u6807"),(0,l.kt)("p",null,"\u540c dev \u4e00\u6837\uff0c\u4f60\u53ef\u4ee5\u4f7f\u7528 ",(0,l.kt)("inlineCode",{parentName:"p"},"--target")," \u8bbe\u7f6e\u76ee\u6807"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"plasmo build --target=firefox-mv2\n")),(0,l.kt)("p",null,(0,l.kt)("a",{parentName:"p",href:"https://docs.plasmo.com/framework/workflows/faq#what-are-the-officially-supported-browser-targets"},"\u652f\u6301\u5217\u8868")),(0,l.kt)("h3",{id:"\u6dfb\u52a0\u81ea\u5b9a\u4e49-tag"},"\u6dfb\u52a0\u81ea\u5b9a\u4e49 tag"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"plasmo build --tag=staging\n")),(0,l.kt)("p",null,"\u5c06\u4f1a\u751f\u6210 ",(0,l.kt)("inlineCode",{parentName:"p"},"build/chrome-mv3-staging")," \u76ee\u5f55\u3002"),(0,l.kt)("h3",{id:"\u53bb\u6389-source-maps-1"},"\u53bb\u6389 source maps"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"plasmo build --source-maps\n")),(0,l.kt)("h3",{id:"\u5176\u4ed6\u4f18\u5316"},"\u5176\u4ed6\u4f18\u5316"),(0,l.kt)("p",null,"\u5173\u95ed minification (\u4e00\u79cd\u4ee3\u7801\u538b\u7f29\u6280\u672f)"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"plasmo build --no-minify\n")),(0,l.kt)("p",null,"\u542f\u7528 ",(0,l.kt)("inlineCode",{parentName:"p"},"hoisting")," \u7684\u6280\u672f\u3002\n\u5728 JavaScript \u548c\u6d4f\u89c8\u5668\u6269\u5c55\u5f00\u53d1\u4e2d\uff0choisting \u6307\u7684\u662f\u63d0\u5347\u6a21\u5757\u4f9d\u8d56\u9879\u7684\u8fc7\u7a0b\uff0c\u4f7f\u5f97\u88ab\u591a\u4e2a\u6587\u4ef6\u5171\u540c\u4f9d\u8d56\u7684\u6a21\u5757\u53ea\u9700\u8981\u52a0\u8f7d\u4e00\u6b21\u3002"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-shell"},"plasmo build --hoist\n")),(0,l.kt)("p",null,"\u4ee5\u4e0a\u7684\u4e24\u4e2a\u53c2\u6570\uff0c\u53ef\u4ee5\u7ec4\u5408\u4f7f\u7528\u3002"))}d.isMDXComponent=!0},9027:(e,t,n)=>{n.d(t,{Z:()=>a});const a=n.p+"assets/images/devmod-0154a12bc307a9ff9eed9d1959254249.jpg"},1622:(e,t,n)=>{n.d(t,{Z:()=>a});const a=n.p+"assets/images/show_extension-2ff6d404b47d0c027ee3105fe0104d5a.jpg"}}]); \ No newline at end of file diff --git a/assets/js/4fbb7b2a.86c86d36.js b/assets/js/4fbb7b2a.86c86d36.js new file mode 100644 index 0000000..a8cad8c --- /dev/null +++ b/assets/js/4fbb7b2a.86c86d36.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkplasmo_co_learn=self.webpackChunkplasmo_co_learn||[]).push([[1691],{3905:(e,t,n)=>{n.d(t,{Zo:()=>m,kt:()=>k});var a=n(7294);function o(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function p(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,a)}return n}function r(e){for(var t=1;t=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var p=Object.getOwnPropertySymbols(e);for(a=0;a=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var l=a.createContext({}),s=function(e){var t=a.useContext(l),n=t;return e&&(n="function"==typeof e?e(t):r(r({},t),e)),n},m=function(e){var t=s(e.components);return a.createElement(l.Provider,{value:t},e.children)},d="mdxType",u={inlineCode:"code",wrapper:function(e){var t=e.children;return a.createElement(a.Fragment,{},t)}},c=a.forwardRef((function(e,t){var n=e.components,o=e.mdxType,p=e.originalType,l=e.parentName,m=i(e,["components","mdxType","originalType","parentName"]),d=s(n),c=o,k=d["".concat(l,".").concat(c)]||d[c]||u[c]||p;return n?a.createElement(k,r(r({ref:t},m),{},{components:n})):a.createElement(k,r({ref:t},m))}));function k(e,t){var n=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var p=n.length,r=new Array(p);r[0]=c;var i={};for(var l in t)hasOwnProperty.call(t,l)&&(i[l]=t[l]);i.originalType=e,i[d]="string"==typeof e?e:o,r[1]=i;for(var s=2;s{n.r(t),n.d(t,{assets:()=>l,contentTitle:()=>r,default:()=>u,frontMatter:()=>p,metadata:()=>i,toc:()=>s});var a=n(7462),o=(n(7294),n(3905));const p={sidebar_position:4},r="\u6269\u5c55\u5185\u7f6e\u9875\u9762",i={unversionedId:"module2/pages",id:"module2/pages",title:"\u6269\u5c55\u5185\u7f6e\u9875\u9762",description:"\u6d4f\u89c8\u5668\u6269\u5c55\u5305\u542b\u51e0\u4e2a\u5185\u7f6e\u9875\u9762\uff0c\u5b8c\u6210\u6d4f\u89c8\u5668\u6269\u5c55\u672c\u8eab\u7684\u884c\u4e3a\u3002\u4ed6\u4eec\u5305\u62ec\u4ee5\u4e0b\u51e0\u79cd :",source:"@site/docs/module2/pages.mdx",sourceDirName:"module2",slug:"/module2/pages",permalink:"/plasmo-co-learn/docs/module2/pages",draft:!1,editUrl:"https://github.com/CreatorsDAO/plasmo-co-learn/tree/main/docs/module2/pages.mdx",tags:[],version:"current",sidebarPosition:4,frontMatter:{sidebar_position:4},sidebar:"tutorialSidebar",previous:{title:"\u5f00\u53d1\u5de5\u4f5c\u6d41",permalink:"/plasmo-co-learn/docs/module2/workflow"},next:{title:"tab pages",permalink:"/plasmo-co-learn/docs/module2/tab_pages"}},l={},s=[{value:"Popup Page",id:"popup-page",level:3},{value:"Options Page",id:"options-page",level:3},{value:"New Tab Page",id:"new-tab-page",level:3},{value:"Dev Tools Page",id:"dev-tools-page",level:3}],m={toc:s},d="wrapper";function u(e){let{components:t,...n}=e;return(0,o.kt)(d,(0,a.Z)({},m,n,{components:t,mdxType:"MDXLayout"}),(0,o.kt)("h1",{id:"\u6269\u5c55\u5185\u7f6e\u9875\u9762"},"\u6269\u5c55\u5185\u7f6e\u9875\u9762"),(0,o.kt)("p",null,"\u6d4f\u89c8\u5668\u6269\u5c55\u5305\u542b\u51e0\u4e2a\u5185\u7f6e\u9875\u9762\uff0c\u5b8c\u6210\u6d4f\u89c8\u5668\u6269\u5c55\u672c\u8eab\u7684\u884c\u4e3a\u3002\u4ed6\u4eec\u5305\u62ec\u4ee5\u4e0b\u51e0\u79cd :"),(0,o.kt)("admonition",{type:"tip"},(0,o.kt)("p",{parentName:"admonition"},"\u5f00\u53d1\u5185\u7f6e\u9875\u9762\u7684\u65f6\u5019\uff0c\u8bf7\u786e\u4fdd\u624b\u5de5\u5237\u65b0\u6d4f\u89c8\u5668\u6269\u5c55\u8d44\u6e90\u3002\u56e0\u4e3a\uff0c\u4ed6\u4eec\u7684\u8fd0\u884c\u73af\u5883\uff0c\u6ca1\u6709\u76d1\u542c ",(0,o.kt)("inlineCode",{parentName:"p"},"web socket")," \u7684\u53d8\u5316\u3002")),(0,o.kt)("h3",{id:"popup-page"},"Popup Page"),(0,o.kt)("p",null,(0,o.kt)("inlineCode",{parentName:"p"},"Popup Page")," \u662f\u6211\u4eec\u5f00\u53d1\u6d4f\u89c8\u5668\u6269\u5c55\u63a5\u89e6\u7684\u7b2c\u4e00\u4e2a\u9875\u9762\uff0c\u4ed6\u53ef\u4ee5\u5728\u7528\u6237\u70b9\u51fb\u6d4f\u89c8\u5668\u6269\u5c55 icon \u7684\u65f6\u5019\u5f39\u51fa\uff0c\u89e6\u53d1\u3002\n\u5728 ",(0,o.kt)("inlineCode",{parentName:"p"},"plasmo")," \u76ee\u5f55\u521b\u5efa ",(0,o.kt)("inlineCode",{parentName:"p"},"popup.tsx")," \u6216\u8005 ",(0,o.kt)("inlineCode",{parentName:"p"},"popup/index.tsx")," \u3002\n\u5176\u4e2d\u5bfc\u51fa\u7684 ",(0,o.kt)("inlineCode",{parentName:"p"},"React dom"),"\u7ed3\u6784\uff0c\u4f1a\u5c55\u793a\u5230 ",(0,o.kt)("inlineCode",{parentName:"p"},"Popup Page"),"\u3002"),(0,o.kt)("p",null,(0,o.kt)("a",{parentName:"p",href:"https://github.com/PlasmoHQ/examples/tree/main/with-popup"},"\u53c2\u8003\u793a\u4f8b with-popup")),(0,o.kt)("h3",{id:"options-page"},"Options Page"),(0,o.kt)("p",null,(0,o.kt)("inlineCode",{parentName:"p"},"Options Page")," \u4e00\u822c\u7528\u4e8e\u6269\u5c55\u672c\u8eab\u7684\u914d\u7f6e\uff0c\u53f3\u952e\u70b9\u51fb\u6269\u5c55 icon \uff0c\u9009\u62e9 \u9009\u9879\uff0c\u5c06\u6253\u5f00\u5bf9\u5e94\u7684\u9875\u9762\u3002\n\u5728 ",(0,o.kt)("inlineCode",{parentName:"p"},"plasmo")," \u76ee\u5f55\u521b\u5efa ",(0,o.kt)("inlineCode",{parentName:"p"},"options.tsx")," \u6216\u8005 ",(0,o.kt)("inlineCode",{parentName:"p"},"options/index.tsx")," \u3002\n\u5176\u4e2d\u5bfc\u51fa\u7684 ",(0,o.kt)("inlineCode",{parentName:"p"},"React dom"),"\u7ed3\u6784\uff0c\u4f1a\u5c55\u793a\u5230 ",(0,o.kt)("inlineCode",{parentName:"p"},"Options Page"),"\u3002"),(0,o.kt)("p",null,(0,o.kt)("a",{parentName:"p",href:"https://github.com/PlasmoHQ/examples/tree/main/with-options-ui"},"\u53c2\u8003\u793a\u4f8b with-options")),(0,o.kt)("h3",{id:"new-tab-page"},"New Tab Page"),(0,o.kt)("p",null,"\u8fd9\u4e2a\u9875\u9762\u662f\u5728\u6d4f\u89c8\u5668\u4e2d\u65b0\u5efa Tab \u9875\u9762\u7684\u65f6\u5019\uff0c\u51fa\u73b0\u7684\u9ed8\u8ba4\u9875\u9762\u3002\n\u6709\u4e9b\u6d4f\u89c8\u5668\u4f1a\u5c55\u793a\u9ed8\u8ba4\u7684\u9875\u9762\uff0c\u9ed8\u8ba4\u9996\u9875 \u7b49\u3002"),(0,o.kt)("admonition",{type:"tip"},(0,o.kt)("p",{parentName:"admonition"},"\u5404\u4e2a \u6269\u5c55\u4e4b\u95f4\u7684 \u8fd9\u4e2a\u9009\u9879\u4f1a\u4e92\u76f8\u8986\u76d6\u3002")),(0,o.kt)("p",null,"\u5728 ",(0,o.kt)("inlineCode",{parentName:"p"},"plasmo")," \u76ee\u5f55\u521b\u5efa ",(0,o.kt)("inlineCode",{parentName:"p"},"newtab.tsx")," \u6216\u8005 ",(0,o.kt)("inlineCode",{parentName:"p"},"newtab/index.tsx")," \u3002\n\u5176\u4e2d\u5bfc\u51fa\u7684 ",(0,o.kt)("inlineCode",{parentName:"p"},"React dom"),"\u7ed3\u6784\uff0c\u4f1a\u5c55\u793a\u5230 ",(0,o.kt)("inlineCode",{parentName:"p"}," New Tab Page"),"\u3002"),(0,o.kt)("p",null,(0,o.kt)("a",{parentName:"p",href:"https://github.com/PlasmoHQ/examples/tree/main/with-newtab"},"\u53c2\u8003\u793a\u4f8b with-newtab")),(0,o.kt)("h3",{id:"dev-tools-page"},"Dev Tools Page"),(0,o.kt)("p",null,"\u8fd9\u4e2a\u9875\u9762\u4f1a\u5728\u6d4f\u89c8\u5668\u8c03\u8bd5 Panel \u4e2d\u5c55\u793a\u3002\n\u5728 ",(0,o.kt)("inlineCode",{parentName:"p"},"plasmo")," \u76ee\u5f55\u521b\u5efa ",(0,o.kt)("inlineCode",{parentName:"p"},"devtools.tsx")," \u6216\u8005 ",(0,o.kt)("inlineCode",{parentName:"p"},"devtools/index.tsx")," \u3002"),(0,o.kt)("admonition",{type:"tip"},(0,o.kt)("p",{parentName:"admonition"},"\u8fd9\u4e2a\u548c\u5176\u4ed6\u5185\u7f6e\u9875\u9762\u4e0d\u592a\u4e00\u6837\u3002\u521b\u5efa panlel \u53ef\u80fd \u9700\u8981 ",(0,o.kt)("inlineCode",{parentName:"p"},"chrome.devtools")," \u7684\u76f8\u5173 API \u3002")),(0,o.kt)("p",null,(0,o.kt)("a",{parentName:"p",href:"https://github.com/PlasmoHQ/examples/tree/main/with-devtools"},"\u53c2\u8003\u793a\u4f8b with-devtools")))}u.isMDXComponent=!0}}]); \ No newline at end of file diff --git a/assets/js/4fbb7b2a.cd24a501.js b/assets/js/4fbb7b2a.cd24a501.js deleted file mode 100644 index 2e982f2..0000000 --- a/assets/js/4fbb7b2a.cd24a501.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkplasmo_co_learn=self.webpackChunkplasmo_co_learn||[]).push([[1691],{3905:(e,t,n)=>{n.d(t,{Zo:()=>m,kt:()=>k});var a=n(7294);function o(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function p(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,a)}return n}function r(e){for(var t=1;t=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var p=Object.getOwnPropertySymbols(e);for(a=0;a=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var l=a.createContext({}),s=function(e){var t=a.useContext(l),n=t;return e&&(n="function"==typeof e?e(t):r(r({},t),e)),n},m=function(e){var t=s(e.components);return a.createElement(l.Provider,{value:t},e.children)},d="mdxType",u={inlineCode:"code",wrapper:function(e){var t=e.children;return a.createElement(a.Fragment,{},t)}},c=a.forwardRef((function(e,t){var n=e.components,o=e.mdxType,p=e.originalType,l=e.parentName,m=i(e,["components","mdxType","originalType","parentName"]),d=s(n),c=o,k=d["".concat(l,".").concat(c)]||d[c]||u[c]||p;return n?a.createElement(k,r(r({ref:t},m),{},{components:n})):a.createElement(k,r({ref:t},m))}));function k(e,t){var n=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var p=n.length,r=new Array(p);r[0]=c;var i={};for(var l in t)hasOwnProperty.call(t,l)&&(i[l]=t[l]);i.originalType=e,i[d]="string"==typeof e?e:o,r[1]=i;for(var s=2;s{n.r(t),n.d(t,{assets:()=>l,contentTitle:()=>r,default:()=>u,frontMatter:()=>p,metadata:()=>i,toc:()=>s});var a=n(7462),o=(n(7294),n(3905));const p={sidebar_position:4},r="\u6d4f\u89c8\u5668\u5185\u7f6e\u9875\u9762",i={unversionedId:"module2/pages",id:"module2/pages",title:"\u6d4f\u89c8\u5668\u5185\u7f6e\u9875\u9762",description:"\u6d4f\u89c8\u5668\u6269\u5c55\u5305\u542b\u51e0\u4e2a\u5185\u7f6e\u9875\u9762\uff0c\u5b8c\u6210\u6d4f\u89c8\u5668\u6269\u5c55\u672c\u8eab\u7684\u884c\u4e3a\u3002\u4ed6\u4eec\u5305\u62ec\u4ee5\u4e0b\u51e0\u79cd :",source:"@site/docs/module2/pages.mdx",sourceDirName:"module2",slug:"/module2/pages",permalink:"/plasmo-co-learn/docs/module2/pages",draft:!1,editUrl:"https://github.com/CreatorsDAO/plasmo-co-learn/tree/main/docs/module2/pages.mdx",tags:[],version:"current",sidebarPosition:4,frontMatter:{sidebar_position:4},sidebar:"tutorialSidebar",previous:{title:"\u5f00\u53d1\u5de5\u4f5c\u6d41",permalink:"/plasmo-co-learn/docs/module2/workflow"},next:{title:"tab pages",permalink:"/plasmo-co-learn/docs/module2/tab_pages"}},l={},s=[{value:"Popup Page",id:"popup-page",level:3},{value:"Options Page",id:"options-page",level:3},{value:"New Tab Page",id:"new-tab-page",level:3},{value:"Dev Tools Page",id:"dev-tools-page",level:3}],m={toc:s},d="wrapper";function u(e){let{components:t,...n}=e;return(0,o.kt)(d,(0,a.Z)({},m,n,{components:t,mdxType:"MDXLayout"}),(0,o.kt)("h1",{id:"\u6d4f\u89c8\u5668\u5185\u7f6e\u9875\u9762"},"\u6d4f\u89c8\u5668\u5185\u7f6e\u9875\u9762"),(0,o.kt)("p",null,"\u6d4f\u89c8\u5668\u6269\u5c55\u5305\u542b\u51e0\u4e2a\u5185\u7f6e\u9875\u9762\uff0c\u5b8c\u6210\u6d4f\u89c8\u5668\u6269\u5c55\u672c\u8eab\u7684\u884c\u4e3a\u3002\u4ed6\u4eec\u5305\u62ec\u4ee5\u4e0b\u51e0\u79cd :"),(0,o.kt)("admonition",{type:"tip"},(0,o.kt)("p",{parentName:"admonition"},"\u5f00\u53d1\u5185\u7f6e\u9875\u9762\u7684\u65f6\u5019\uff0c\u8bf7\u786e\u4fdd\u624b\u5de5\u5237\u65b0\u6d4f\u89c8\u5668\u6269\u5c55\u8d44\u6e90\u3002\u56e0\u4e3a\uff0c\u4ed6\u4eec\u7684\u8fd0\u884c\u73af\u5883\uff0c\u6ca1\u6709\u76d1\u542c ",(0,o.kt)("inlineCode",{parentName:"p"},"web socket")," \u7684\u53d8\u5316\u3002")),(0,o.kt)("h3",{id:"popup-page"},"Popup Page"),(0,o.kt)("p",null,(0,o.kt)("inlineCode",{parentName:"p"},"Popup Page")," \u662f\u6211\u4eec\u5f00\u53d1\u6d4f\u89c8\u5668\u6269\u5c55\u63a5\u89e6\u7684\u7b2c\u4e00\u4e2a\u9875\u9762\uff0c\u4ed6\u53ef\u4ee5\u5728\u7528\u6237\u70b9\u51fb\u6d4f\u89c8\u5668\u6269\u5c55 icon \u7684\u65f6\u5019\u5f39\u51fa\uff0c\u89e6\u53d1\u3002\n\u5728 ",(0,o.kt)("inlineCode",{parentName:"p"},"plasmo")," \u76ee\u5f55\u521b\u5efa ",(0,o.kt)("inlineCode",{parentName:"p"},"popup.tsx")," \u6216\u8005 ",(0,o.kt)("inlineCode",{parentName:"p"},"popup/index.tsx")," \u3002\n\u5176\u4e2d\u5bfc\u51fa\u7684 ",(0,o.kt)("inlineCode",{parentName:"p"},"React dom"),"\u7ed3\u6784\uff0c\u4f1a\u5c55\u793a\u5230 ",(0,o.kt)("inlineCode",{parentName:"p"},"Popup Page"),"\u3002"),(0,o.kt)("p",null,(0,o.kt)("a",{parentName:"p",href:"https://github.com/PlasmoHQ/examples/tree/main/with-popup"},"\u53c2\u8003\u793a\u4f8b with-popup")),(0,o.kt)("h3",{id:"options-page"},"Options Page"),(0,o.kt)("p",null,(0,o.kt)("inlineCode",{parentName:"p"},"Options Page")," \u4e00\u822c\u7528\u4e8e\u6269\u5c55\u672c\u8eab\u7684\u914d\u7f6e\uff0c\u53f3\u952e\u70b9\u51fb\u6269\u5c55 icon \uff0c\u9009\u62e9 \u9009\u9879\uff0c\u5c06\u6253\u5f00\u5bf9\u5e94\u7684\u9875\u9762\u3002\n\u5728 ",(0,o.kt)("inlineCode",{parentName:"p"},"plasmo")," \u76ee\u5f55\u521b\u5efa ",(0,o.kt)("inlineCode",{parentName:"p"},"options.tsx")," \u6216\u8005 ",(0,o.kt)("inlineCode",{parentName:"p"},"options/index.tsx")," \u3002\n\u5176\u4e2d\u5bfc\u51fa\u7684 ",(0,o.kt)("inlineCode",{parentName:"p"},"React dom"),"\u7ed3\u6784\uff0c\u4f1a\u5c55\u793a\u5230 ",(0,o.kt)("inlineCode",{parentName:"p"},"Options Page"),"\u3002"),(0,o.kt)("p",null,(0,o.kt)("a",{parentName:"p",href:"https://github.com/PlasmoHQ/examples/tree/main/with-options-ui"},"\u53c2\u8003\u793a\u4f8b with-options")),(0,o.kt)("h3",{id:"new-tab-page"},"New Tab Page"),(0,o.kt)("p",null,"\u8fd9\u4e2a\u9875\u9762\u662f\u5728\u6d4f\u89c8\u5668\u4e2d\u65b0\u5efa Tab \u9875\u9762\u7684\u65f6\u5019\uff0c\u51fa\u73b0\u7684\u9ed8\u8ba4\u9875\u9762\u3002\n\u6709\u4e9b\u6d4f\u89c8\u5668\u4f1a\u5c55\u793a\u9ed8\u8ba4\u7684\u9875\u9762\uff0c\u9ed8\u8ba4\u9996\u9875 \u7b49\u3002"),(0,o.kt)("admonition",{type:"tip"},(0,o.kt)("p",{parentName:"admonition"},"\u5404\u4e2a \u6269\u5c55\u4e4b\u95f4\u7684 \u8fd9\u4e2a\u9009\u9879\u4f1a\u4e92\u76f8\u8986\u76d6\u3002")),(0,o.kt)("p",null,"\u5728 ",(0,o.kt)("inlineCode",{parentName:"p"},"plasmo")," \u76ee\u5f55\u521b\u5efa ",(0,o.kt)("inlineCode",{parentName:"p"},"newtab.tsx")," \u6216\u8005 ",(0,o.kt)("inlineCode",{parentName:"p"},"newtab/index.tsx")," \u3002\n\u5176\u4e2d\u5bfc\u51fa\u7684 ",(0,o.kt)("inlineCode",{parentName:"p"},"React dom"),"\u7ed3\u6784\uff0c\u4f1a\u5c55\u793a\u5230 ",(0,o.kt)("inlineCode",{parentName:"p"}," New Tab Page"),"\u3002"),(0,o.kt)("p",null,(0,o.kt)("a",{parentName:"p",href:"https://github.com/PlasmoHQ/examples/tree/main/with-newtab"},"\u53c2\u8003\u793a\u4f8b with-newtab")),(0,o.kt)("h3",{id:"dev-tools-page"},"Dev Tools Page"),(0,o.kt)("p",null,"\u8fd9\u4e2a\u9875\u9762\u4f1a\u5728\u6d4f\u89c8\u5668\u8c03\u8bd5 Panel \u4e2d\u5c55\u793a\u3002\n\u5728 ",(0,o.kt)("inlineCode",{parentName:"p"},"plasmo")," \u76ee\u5f55\u521b\u5efa ",(0,o.kt)("inlineCode",{parentName:"p"},"devtools.tsx")," \u6216\u8005 ",(0,o.kt)("inlineCode",{parentName:"p"},"devtools/index.tsx")," \u3002"),(0,o.kt)("admonition",{type:"tip"},(0,o.kt)("p",{parentName:"admonition"},"\u8fd9\u4e2a\u548c\u5176\u4ed6\u5185\u7f6e\u9875\u9762\u4e0d\u592a\u4e00\u6837\u3002\u521b\u5efa panlel \u53ef\u80fd \u9700\u8981 ",(0,o.kt)("inlineCode",{parentName:"p"},"chrome.devtools")," \u7684\u76f8\u5173 API \u3002")),(0,o.kt)("p",null,(0,o.kt)("a",{parentName:"p",href:"https://github.com/PlasmoHQ/examples/tree/main/with-devtools"},"\u53c2\u8003\u793a\u4f8b with-devtools")))}u.isMDXComponent=!0}}]); \ No newline at end of file diff --git a/assets/js/78b543d2.86aaf417.js b/assets/js/78b543d2.21a0ebf4.js similarity index 86% rename from assets/js/78b543d2.86aaf417.js rename to assets/js/78b543d2.21a0ebf4.js index b84ae06..d01c0a1 100644 --- a/assets/js/78b543d2.86aaf417.js +++ b/assets/js/78b543d2.21a0ebf4.js @@ -1 +1 @@ -"use strict";(self.webpackChunkplasmo_co_learn=self.webpackChunkplasmo_co_learn||[]).push([[5777],{3905:(e,t,r)=>{r.d(t,{Zo:()=>s,kt:()=>f});var n=r(7294);function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function c(e){for(var t=1;t=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var l=n.createContext({}),p=function(e){var t=n.useContext(l),r=t;return e&&(r="function"==typeof e?e(t):c(c({},t),e)),r},s=function(e){var t=p(e.components);return n.createElement(l.Provider,{value:t},e.children)},u="mdxType",m={inlineCode:"code",wrapper:function(e){var t=e.children;return n.createElement(n.Fragment,{},t)}},d=n.forwardRef((function(e,t){var r=e.components,o=e.mdxType,a=e.originalType,l=e.parentName,s=i(e,["components","mdxType","originalType","parentName"]),u=p(r),d=o,f=u["".concat(l,".").concat(d)]||u[d]||m[d]||a;return r?n.createElement(f,c(c({ref:t},s),{},{components:r})):n.createElement(f,c({ref:t},s))}));function f(e,t){var r=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=r.length,c=new Array(a);c[0]=d;var i={};for(var l in t)hasOwnProperty.call(t,l)&&(i[l]=t[l]);i.originalType=e,i[u]="string"==typeof e?e:o,c[1]=i;for(var p=2;p{r.r(t),r.d(t,{assets:()=>l,contentTitle:()=>c,default:()=>m,frontMatter:()=>a,metadata:()=>i,toc:()=>p});var n=r(7462),o=(r(7294),r(3905));const a={sidebar_position:5},c="tab pages",i={unversionedId:"module2/tab_pages",id:"module2/tab_pages",title:"tab pages",description:"",source:"@site/docs/module2/tab_pages.mdx",sourceDirName:"module2",slug:"/module2/tab_pages",permalink:"/plasmo-co-learn/docs/module2/tab_pages",draft:!1,editUrl:"https://github.com/CreatorsDAO/plasmo-co-learn/tree/main/docs/module2/tab_pages.mdx",tags:[],version:"current",sidebarPosition:5,frontMatter:{sidebar_position:5},sidebar:"tutorialSidebar",previous:{title:"\u6d4f\u89c8\u5668\u5185\u7f6e\u9875\u9762",permalink:"/plasmo-co-learn/docs/module2/pages"},next:{title:"sandbox pages",permalink:"/plasmo-co-learn/docs/module2/sandbox_pages"}},l={},p=[],s={toc:p},u="wrapper";function m(e){let{components:t,...r}=e;return(0,o.kt)(u,(0,n.Z)({},s,r,{components:t,mdxType:"MDXLayout"}),(0,o.kt)("h1",{id:"tab-pages"},"tab pages"))}m.isMDXComponent=!0}}]); \ No newline at end of file +"use strict";(self.webpackChunkplasmo_co_learn=self.webpackChunkplasmo_co_learn||[]).push([[5777],{3905:(e,t,r)=>{r.d(t,{Zo:()=>s,kt:()=>f});var n=r(7294);function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function c(e){for(var t=1;t=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var l=n.createContext({}),p=function(e){var t=n.useContext(l),r=t;return e&&(r="function"==typeof e?e(t):c(c({},t),e)),r},s=function(e){var t=p(e.components);return n.createElement(l.Provider,{value:t},e.children)},u="mdxType",m={inlineCode:"code",wrapper:function(e){var t=e.children;return n.createElement(n.Fragment,{},t)}},d=n.forwardRef((function(e,t){var r=e.components,o=e.mdxType,a=e.originalType,l=e.parentName,s=i(e,["components","mdxType","originalType","parentName"]),u=p(r),d=o,f=u["".concat(l,".").concat(d)]||u[d]||m[d]||a;return r?n.createElement(f,c(c({ref:t},s),{},{components:r})):n.createElement(f,c({ref:t},s))}));function f(e,t){var r=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=r.length,c=new Array(a);c[0]=d;var i={};for(var l in t)hasOwnProperty.call(t,l)&&(i[l]=t[l]);i.originalType=e,i[u]="string"==typeof e?e:o,c[1]=i;for(var p=2;p{r.r(t),r.d(t,{assets:()=>l,contentTitle:()=>c,default:()=>m,frontMatter:()=>a,metadata:()=>i,toc:()=>p});var n=r(7462),o=(r(7294),r(3905));const a={sidebar_position:5},c="tab pages",i={unversionedId:"module2/tab_pages",id:"module2/tab_pages",title:"tab pages",description:"",source:"@site/docs/module2/tab_pages.mdx",sourceDirName:"module2",slug:"/module2/tab_pages",permalink:"/plasmo-co-learn/docs/module2/tab_pages",draft:!1,editUrl:"https://github.com/CreatorsDAO/plasmo-co-learn/tree/main/docs/module2/tab_pages.mdx",tags:[],version:"current",sidebarPosition:5,frontMatter:{sidebar_position:5},sidebar:"tutorialSidebar",previous:{title:"\u6269\u5c55\u5185\u7f6e\u9875\u9762",permalink:"/plasmo-co-learn/docs/module2/pages"},next:{title:"sandbox pages",permalink:"/plasmo-co-learn/docs/module2/sandbox_pages"}},l={},p=[],s={toc:p},u="wrapper";function m(e){let{components:t,...r}=e;return(0,o.kt)(u,(0,n.Z)({},s,r,{components:t,mdxType:"MDXLayout"}),(0,o.kt)("h1",{id:"tab-pages"},"tab pages"))}m.isMDXComponent=!0}}]); \ No newline at end of file diff --git a/assets/js/935f2afb.3fee8221.js b/assets/js/935f2afb.3fee8221.js deleted file mode 100644 index ab6713e..0000000 --- a/assets/js/935f2afb.3fee8221.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkplasmo_co_learn=self.webpackChunkplasmo_co_learn||[]).push([[53],{1109:e=>{e.exports=JSON.parse('{"pluginId":"default","version":"current","label":"Next","banner":null,"badge":false,"noIndex":false,"className":"docs-version-current","isLast":true,"docsSidebars":{"tutorialSidebar":[{"type":"link","label":"\u5b66\u524d\u5fc5\u8bfb","href":"/plasmo-co-learn/docs/intro","docId":"intro"},{"type":"category","label":"plasmo\u4ecb\u7ecd & \u73af\u5883\u51c6\u5907","collapsible":true,"collapsed":true,"items":[{"type":"link","label":"\u6b22\u8fce\u6765\u5230 plasmo \u7684\u4e16\u754c","href":"/plasmo-co-learn/docs/module1/introduction","docId":"module1/introduction"},{"type":"link","label":"\u5f00\u53d1\u4f60\u7684\u7b2c\u4e00\u4e2a\u6d4f\u89c8\u5668\u6269\u5c55","href":"/plasmo-co-learn/docs/module1/first-extension","docId":"module1/first-extension"},{"type":"link","label":"10 \u5206\u949f React","href":"/plasmo-co-learn/docs/module1/basic_react","docId":"module1/basic_react"}],"href":"/plasmo-co-learn/docs/module1/"},{"type":"category","label":"Plasmo Pages ","collapsible":true,"collapsed":true,"items":[{"type":"link","label":"\u5f00\u53d1\u5de5\u4f5c\u6d41","href":"/plasmo-co-learn/docs/module2/workflow","docId":"module2/workflow"},{"type":"link","label":"\u6d4f\u89c8\u5668\u5185\u7f6e\u9875\u9762","href":"/plasmo-co-learn/docs/module2/pages","docId":"module2/pages"},{"type":"link","label":"tab pages","href":"/plasmo-co-learn/docs/module2/tab_pages","docId":"module2/tab_pages"},{"type":"link","label":"sandbox pages","href":"/plasmo-co-learn/docs/module2/sandbox_pages","docId":"module2/sandbox_pages"},{"type":"link","label":"\u9759\u6001\u8d44\u6e90\u4f7f\u7528","href":"/plasmo-co-learn/docs/module2/assets","docId":"module2/assets"}],"href":"/plasmo-co-learn/docs/module2/"},{"type":"category","label":"Content Script (UI)","collapsible":true,"collapsed":true,"items":[{"type":"link","label":"Content Script","href":"/plasmo-co-learn/docs/module3/content","docId":"module3/content"},{"type":"link","label":"Content Script UI","href":"/plasmo-co-learn/docs/module3/contentui","docId":"module3/contentui"}],"href":"/plasmo-co-learn/docs/module3/"},{"type":"category","label":"\u5916\u90e8\u901a\u4fe1","collapsible":true,"collapsed":true,"items":[{"type":"link","label":"Background Service Worker","href":"/plasmo-co-learn/docs/module4/background","docId":"module4/background"},{"type":"link","label":"Message API","href":"/plasmo-co-learn/docs/module4/message","docId":"module4/message"},{"type":"link","label":"Storage","href":"/plasmo-co-learn/docs/module4/storage","docId":"module4/storage"},{"type":"link","label":"Remote Code","href":"/plasmo-co-learn/docs/module4/remote","docId":"module4/remote"}]}]},"docs":{"intro":{"id":"intro","title":"\u5b66\u524d\u5fc5\u8bfb","description":"\u8fd9\u95e8\u8bfe\u4e3b\u8981\u5b66\u4e60\u5982\u4f55 plasmo \u6784\u5efa\u4e00\u4e2a\u81ea\u5df1\u9700\u8981\u7684\u6d4f\u89c8\u5668\u6269\u5c55\u3002","sidebar":"tutorialSidebar"},"module1/basic_react":{"id":"module1/basic_react","title":"10 \u5206\u949f React","description":"\u6d4f\u89c8\u5668\u6269\u5c55\u662f\u4e00\u4e2a\u524d\u7aef\u5bc6\u96c6\u578b\u9879\u76ee\u3002","sidebar":"tutorialSidebar"},"module1/first-extension":{"id":"module1/first-extension","title":"\u5f00\u53d1\u4f60\u7684\u7b2c\u4e00\u4e2a\u6d4f\u89c8\u5668\u6269\u5c55","description":"cli demo","sidebar":"tutorialSidebar"},"module1/introduction":{"id":"module1/introduction","title":"\u6b22\u8fce\u6765\u5230 plasmo \u7684\u4e16\u754c","description":"plasmo \u662f\u4ec0\u4e48\u5462\uff1f \u4ed6\u662f\u4e00\u4e2a all-in-one \u7c7b\u578b\u7684\u6d4f\u89c8\u5668\u6269\u5c55\u5f00\u53d1\u5e73\u53f0\u3002 plasmo \u7684\u5b58\u5728\uff0c\u7b80\u5316\u4e86\u6d4f\u89c8\u5668\u5f00\u53d1\u7684\u5404\u4e2a\u9636\u6bb5\uff0c\u5305\u62ec: \u521b\u5efa\uff0c\u6d4b\u8bd5\uff0c\u53d1\u5e03\u3002","sidebar":"tutorialSidebar"},"module1/readme":{"id":"module1/readme","title":"\u6a21\u5757\u4ecb\u7ecd","description":"","sidebar":"tutorialSidebar"},"module2/assets":{"id":"module2/assets","title":"\u9759\u6001\u8d44\u6e90\u4f7f\u7528","description":"\u8d44\u6e90","sidebar":"tutorialSidebar"},"module2/index":{"id":"module2/index","title":"\u6a21\u5757\u4ecb\u7ecd","description":"","sidebar":"tutorialSidebar"},"module2/pages":{"id":"module2/pages","title":"\u6d4f\u89c8\u5668\u5185\u7f6e\u9875\u9762","description":"\u6d4f\u89c8\u5668\u6269\u5c55\u5305\u542b\u51e0\u4e2a\u5185\u7f6e\u9875\u9762\uff0c\u5b8c\u6210\u6d4f\u89c8\u5668\u6269\u5c55\u672c\u8eab\u7684\u884c\u4e3a\u3002\u4ed6\u4eec\u5305\u62ec\u4ee5\u4e0b\u51e0\u79cd :","sidebar":"tutorialSidebar"},"module2/sandbox_pages":{"id":"module2/sandbox_pages","title":"sandbox pages","description":"","sidebar":"tutorialSidebar"},"module2/tab_pages":{"id":"module2/tab_pages","title":"tab pages","description":"","sidebar":"tutorialSidebar"},"module2/workflow":{"id":"module2/workflow","title":"\u5f00\u53d1\u5de5\u4f5c\u6d41","description":"\u8fd9\u91cc\u4e3b\u8981\u4ecb\u7ecd\u4f7f\u7528 plasmo \u5f00\u53d1\u6d4f\u89c8\u5668\u6269\u5c55\u7684\u5de5\u4f5c\u6d41\u3002","sidebar":"tutorialSidebar"},"module3/content":{"id":"module3/content","title":"Content Script","description":"","sidebar":"tutorialSidebar"},"module3/contentui":{"id":"module3/contentui","title":"Content Script UI","description":"","sidebar":"tutorialSidebar"},"module3/index":{"id":"module3/index","title":"\u6a21\u5757\u4ecb\u7ecd","description":"","sidebar":"tutorialSidebar"},"module4/background":{"id":"module4/background","title":"Background Service Worker","description":"","sidebar":"tutorialSidebar"},"module4/message":{"id":"module4/message","title":"Message API","description":"","sidebar":"tutorialSidebar"},"module4/remote":{"id":"module4/remote","title":"Remote Code","description":"","sidebar":"tutorialSidebar"},"module4/storage":{"id":"module4/storage","title":"Storage","description":"","sidebar":"tutorialSidebar"}}}')}}]); \ No newline at end of file diff --git a/assets/js/935f2afb.af6e4ba6.js b/assets/js/935f2afb.af6e4ba6.js new file mode 100644 index 0000000..be9a858 --- /dev/null +++ b/assets/js/935f2afb.af6e4ba6.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkplasmo_co_learn=self.webpackChunkplasmo_co_learn||[]).push([[53],{1109:e=>{e.exports=JSON.parse('{"pluginId":"default","version":"current","label":"Next","banner":null,"badge":false,"noIndex":false,"className":"docs-version-current","isLast":true,"docsSidebars":{"tutorialSidebar":[{"type":"link","label":"\u5b66\u524d\u5fc5\u8bfb","href":"/plasmo-co-learn/docs/intro","docId":"intro"},{"type":"category","label":"plasmo\u4ecb\u7ecd & \u73af\u5883\u51c6\u5907","collapsible":true,"collapsed":true,"items":[{"type":"link","label":"\u6b22\u8fce\u6765\u5230 plasmo \u7684\u4e16\u754c","href":"/plasmo-co-learn/docs/module1/introduction","docId":"module1/introduction"},{"type":"link","label":"\u5f00\u53d1\u4f60\u7684\u7b2c\u4e00\u4e2a\u6d4f\u89c8\u5668\u6269\u5c55","href":"/plasmo-co-learn/docs/module1/first-extension","docId":"module1/first-extension"},{"type":"link","label":"10 \u5206\u949f React","href":"/plasmo-co-learn/docs/module1/basic_react","docId":"module1/basic_react"}],"href":"/plasmo-co-learn/docs/module1/"},{"type":"category","label":"Plasmo Pages ","collapsible":true,"collapsed":true,"items":[{"type":"link","label":"\u5f00\u53d1\u5de5\u4f5c\u6d41","href":"/plasmo-co-learn/docs/module2/workflow","docId":"module2/workflow"},{"type":"link","label":"\u6269\u5c55\u5185\u7f6e\u9875\u9762","href":"/plasmo-co-learn/docs/module2/pages","docId":"module2/pages"},{"type":"link","label":"tab pages","href":"/plasmo-co-learn/docs/module2/tab_pages","docId":"module2/tab_pages"},{"type":"link","label":"sandbox pages","href":"/plasmo-co-learn/docs/module2/sandbox_pages","docId":"module2/sandbox_pages"},{"type":"link","label":"\u9759\u6001\u8d44\u6e90\u4f7f\u7528","href":"/plasmo-co-learn/docs/module2/assets","docId":"module2/assets"}],"href":"/plasmo-co-learn/docs/module2/"},{"type":"category","label":"Content Script (UI)","collapsible":true,"collapsed":true,"items":[{"type":"link","label":"Content Script","href":"/plasmo-co-learn/docs/module3/content","docId":"module3/content"},{"type":"link","label":"Content Script UI","href":"/plasmo-co-learn/docs/module3/contentui","docId":"module3/contentui"}],"href":"/plasmo-co-learn/docs/module3/"},{"type":"category","label":"\u5916\u90e8\u901a\u4fe1","collapsible":true,"collapsed":true,"items":[{"type":"link","label":"Background Service Worker","href":"/plasmo-co-learn/docs/module4/background","docId":"module4/background"},{"type":"link","label":"Message API","href":"/plasmo-co-learn/docs/module4/message","docId":"module4/message"},{"type":"link","label":"Storage","href":"/plasmo-co-learn/docs/module4/storage","docId":"module4/storage"},{"type":"link","label":"Remote Code","href":"/plasmo-co-learn/docs/module4/remote","docId":"module4/remote"}]}]},"docs":{"intro":{"id":"intro","title":"\u5b66\u524d\u5fc5\u8bfb","description":"\u8fd9\u95e8\u8bfe\u4e3b\u8981\u5b66\u4e60\u5982\u4f55 plasmo \u6784\u5efa\u4e00\u4e2a\u81ea\u5df1\u9700\u8981\u7684\u6d4f\u89c8\u5668\u6269\u5c55\u3002","sidebar":"tutorialSidebar"},"module1/basic_react":{"id":"module1/basic_react","title":"10 \u5206\u949f React","description":"\u6d4f\u89c8\u5668\u6269\u5c55\u662f\u4e00\u4e2a\u524d\u7aef\u5bc6\u96c6\u578b\u9879\u76ee\u3002","sidebar":"tutorialSidebar"},"module1/first-extension":{"id":"module1/first-extension","title":"\u5f00\u53d1\u4f60\u7684\u7b2c\u4e00\u4e2a\u6d4f\u89c8\u5668\u6269\u5c55","description":"cli demo","sidebar":"tutorialSidebar"},"module1/introduction":{"id":"module1/introduction","title":"\u6b22\u8fce\u6765\u5230 plasmo \u7684\u4e16\u754c","description":"plasmo \u662f\u4ec0\u4e48\u5462\uff1f \u4ed6\u662f\u4e00\u4e2a all-in-one \u7c7b\u578b\u7684\u6d4f\u89c8\u5668\u6269\u5c55\u5f00\u53d1\u5e73\u53f0\u3002 plasmo \u7684\u5b58\u5728\uff0c\u7b80\u5316\u4e86\u6d4f\u89c8\u5668\u5f00\u53d1\u7684\u5404\u4e2a\u9636\u6bb5\uff0c\u5305\u62ec: \u521b\u5efa\uff0c\u6d4b\u8bd5\uff0c\u53d1\u5e03\u3002","sidebar":"tutorialSidebar"},"module1/readme":{"id":"module1/readme","title":"\u6a21\u5757\u4ecb\u7ecd","description":"","sidebar":"tutorialSidebar"},"module2/assets":{"id":"module2/assets","title":"\u9759\u6001\u8d44\u6e90\u4f7f\u7528","description":"\u8d44\u6e90","sidebar":"tutorialSidebar"},"module2/index":{"id":"module2/index","title":"\u6a21\u5757\u4ecb\u7ecd","description":"","sidebar":"tutorialSidebar"},"module2/pages":{"id":"module2/pages","title":"\u6269\u5c55\u5185\u7f6e\u9875\u9762","description":"\u6d4f\u89c8\u5668\u6269\u5c55\u5305\u542b\u51e0\u4e2a\u5185\u7f6e\u9875\u9762\uff0c\u5b8c\u6210\u6d4f\u89c8\u5668\u6269\u5c55\u672c\u8eab\u7684\u884c\u4e3a\u3002\u4ed6\u4eec\u5305\u62ec\u4ee5\u4e0b\u51e0\u79cd :","sidebar":"tutorialSidebar"},"module2/sandbox_pages":{"id":"module2/sandbox_pages","title":"sandbox pages","description":"","sidebar":"tutorialSidebar"},"module2/tab_pages":{"id":"module2/tab_pages","title":"tab pages","description":"","sidebar":"tutorialSidebar"},"module2/workflow":{"id":"module2/workflow","title":"\u5f00\u53d1\u5de5\u4f5c\u6d41","description":"\u8fd9\u91cc\u4e3b\u8981\u4ecb\u7ecd\u4f7f\u7528 plasmo \u5f00\u53d1\u6d4f\u89c8\u5668\u6269\u5c55\u7684\u5de5\u4f5c\u6d41\u3002","sidebar":"tutorialSidebar"},"module3/content":{"id":"module3/content","title":"Content Script","description":"","sidebar":"tutorialSidebar"},"module3/contentui":{"id":"module3/contentui","title":"Content Script UI","description":"","sidebar":"tutorialSidebar"},"module3/index":{"id":"module3/index","title":"\u6a21\u5757\u4ecb\u7ecd","description":"","sidebar":"tutorialSidebar"},"module4/background":{"id":"module4/background","title":"Background Service Worker","description":"","sidebar":"tutorialSidebar"},"module4/message":{"id":"module4/message","title":"Message API","description":"","sidebar":"tutorialSidebar"},"module4/remote":{"id":"module4/remote","title":"Remote Code","description":"","sidebar":"tutorialSidebar"},"module4/storage":{"id":"module4/storage","title":"Storage","description":"","sidebar":"tutorialSidebar"}}}')}}]); \ No newline at end of file diff --git a/assets/js/runtime~main.3eff7a57.js b/assets/js/runtime~main.3eff7a57.js deleted file mode 100644 index 3c6362e..0000000 --- a/assets/js/runtime~main.3eff7a57.js +++ /dev/null @@ -1 +0,0 @@ -(()=>{"use strict";var e,a,r,t,f,c={},o={};function d(e){var a=o[e];if(void 0!==a)return a.exports;var r=o[e]={id:e,loaded:!1,exports:{}};return c[e].call(r.exports,r,r.exports,d),r.loaded=!0,r.exports}d.m=c,d.c=o,e=[],d.O=(a,r,t,f)=>{if(!r){var c=1/0;for(i=0;i=f)&&Object.keys(d.O).every((e=>d.O[e](r[b])))?r.splice(b--,1):(o=!1,f0&&e[i-1][2]>f;i--)e[i]=e[i-1];e[i]=[r,t,f]},d.n=e=>{var a=e&&e.__esModule?()=>e.default:()=>e;return d.d(a,{a:a}),a},r=Object.getPrototypeOf?e=>Object.getPrototypeOf(e):e=>e.__proto__,d.t=function(e,t){if(1&t&&(e=this(e)),8&t)return e;if("object"==typeof e&&e){if(4&t&&e.__esModule)return e;if(16&t&&"function"==typeof e.then)return e}var f=Object.create(null);d.r(f);var c={};a=a||[null,r({}),r([]),r(r)];for(var o=2&t&&e;"object"==typeof o&&!~a.indexOf(o);o=r(o))Object.getOwnPropertyNames(o).forEach((a=>c[a]=()=>e[a]));return c.default=()=>e,d.d(f,c),f},d.d=(e,a)=>{for(var r in a)d.o(a,r)&&!d.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:a[r]})},d.f={},d.e=e=>Promise.all(Object.keys(d.f).reduce(((a,r)=>(d.f[r](e,a),a)),[])),d.u=e=>"assets/js/"+({5:"68f6967e",53:"935f2afb",720:"4b1c66fd",1237:"6b9cf11d",1691:"4fbb7b2a",1862:"7f6d2349",1914:"d9f32620",2021:"9df216ac",2267:"59362658",2336:"fc2d5142",2535:"814f3328",2584:"cc6b848a",2907:"8a354aeb",3026:"1ee05011",3085:"1f391b9e",3089:"a6aa9e1f",3241:"4dd79207",3608:"9e4087bc",4013:"01a85c17",4195:"c4f5d8e4",4316:"2e9d9707",4781:"67819035",4942:"1a8fc9ba",5370:"ef8c40a5",5481:"cbf5fcec",5777:"78b543d2",5860:"d2e43329",6026:"02fbe9ca",6103:"ccc49370",6385:"77fbf8f1",6480:"19435779",7414:"393be207",7518:"4a0c03ec",7642:"2667c855",7643:"305cbda3",7918:"17896441",8610:"6875c492",8636:"f4f34a3a",9099:"b51e0dd8",9209:"336757ee",9301:"2573322b",9459:"16e31973",9514:"1be78505",9642:"7661071f",9671:"0e384e19",9906:"03e6874b"}[e]||e)+"."+{5:"dac034db",53:"3fee8221",720:"9eaa17d7",1237:"f6e28d40",1506:"d5e5f0dc",1691:"cd24a501",1862:"3ac43f79",1914:"b4ca5ec1",2021:"6332e529",2267:"482d3449",2336:"0c73c534",2529:"a61056b4",2535:"318c8932",2584:"5b8ce5d2",2907:"e81bae88",3026:"93a4d231",3085:"b156793e",3089:"407eb80e",3241:"36347b66",3608:"7aeff431",4013:"86f8d315",4195:"c40ce18f",4316:"905695f6",4781:"e7d3d22d",4942:"002624c2",4972:"e44a569c",5370:"e3b457d9",5481:"dd35331e",5777:"86aaf417",5860:"6f373289",6026:"83a32f1e",6103:"ed7197f6",6385:"13c6a529",6480:"0bfcab2e",7414:"527979f3",7518:"0e6a6cae",7642:"318e589a",7643:"b3abfe76",7918:"8ab55542",8610:"468d541a",8636:"ac5f507c",9099:"2ae7f368",9209:"2f263544",9301:"0f095ca2",9459:"b947a397",9514:"558272c1",9642:"296bcadc",9671:"1eb8bbef",9906:"aedb59e0"}[e]+".js",d.miniCssF=e=>{},d.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),d.o=(e,a)=>Object.prototype.hasOwnProperty.call(e,a),t={},f="plasmo-co-learn:",d.l=(e,a,r,c)=>{if(t[e])t[e].push(a);else{var o,b;if(void 0!==r)for(var n=document.getElementsByTagName("script"),i=0;i{o.onerror=o.onload=null,clearTimeout(s);var f=t[e];if(delete t[e],o.parentNode&&o.parentNode.removeChild(o),f&&f.forEach((e=>e(r))),a)return a(r)},s=setTimeout(u.bind(null,void 0,{type:"timeout",target:o}),12e4);o.onerror=u.bind(null,o.onerror),o.onload=u.bind(null,o.onload),b&&document.head.appendChild(o)}},d.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},d.p="/plasmo-co-learn/",d.gca=function(e){return e={17896441:"7918",19435779:"6480",59362658:"2267",67819035:"4781","68f6967e":"5","935f2afb":"53","4b1c66fd":"720","6b9cf11d":"1237","4fbb7b2a":"1691","7f6d2349":"1862",d9f32620:"1914","9df216ac":"2021",fc2d5142:"2336","814f3328":"2535",cc6b848a:"2584","8a354aeb":"2907","1ee05011":"3026","1f391b9e":"3085",a6aa9e1f:"3089","4dd79207":"3241","9e4087bc":"3608","01a85c17":"4013",c4f5d8e4:"4195","2e9d9707":"4316","1a8fc9ba":"4942",ef8c40a5:"5370",cbf5fcec:"5481","78b543d2":"5777",d2e43329:"5860","02fbe9ca":"6026",ccc49370:"6103","77fbf8f1":"6385","393be207":"7414","4a0c03ec":"7518","2667c855":"7642","305cbda3":"7643","6875c492":"8610",f4f34a3a:"8636",b51e0dd8:"9099","336757ee":"9209","2573322b":"9301","16e31973":"9459","1be78505":"9514","7661071f":"9642","0e384e19":"9671","03e6874b":"9906"}[e]||e,d.p+d.u(e)},(()=>{var e={1303:0,532:0};d.f.j=(a,r)=>{var t=d.o(e,a)?e[a]:void 0;if(0!==t)if(t)r.push(t[2]);else if(/^(1303|532)$/.test(a))e[a]=0;else{var f=new Promise(((r,f)=>t=e[a]=[r,f]));r.push(t[2]=f);var c=d.p+d.u(a),o=new Error;d.l(c,(r=>{if(d.o(e,a)&&(0!==(t=e[a])&&(e[a]=void 0),t)){var f=r&&("load"===r.type?"missing":r.type),c=r&&r.target&&r.target.src;o.message="Loading chunk "+a+" failed.\n("+f+": "+c+")",o.name="ChunkLoadError",o.type=f,o.request=c,t[1](o)}}),"chunk-"+a,a)}},d.O.j=a=>0===e[a];var a=(a,r)=>{var t,f,c=r[0],o=r[1],b=r[2],n=0;if(c.some((a=>0!==e[a]))){for(t in o)d.o(o,t)&&(d.m[t]=o[t]);if(b)var i=b(d)}for(a&&a(r);n{"use strict";var e,a,r,t,f,c={},d={};function o(e){var a=d[e];if(void 0!==a)return a.exports;var r=d[e]={id:e,loaded:!1,exports:{}};return c[e].call(r.exports,r,r.exports,o),r.loaded=!0,r.exports}o.m=c,o.c=d,e=[],o.O=(a,r,t,f)=>{if(!r){var c=1/0;for(i=0;i=f)&&Object.keys(o.O).every((e=>o.O[e](r[b])))?r.splice(b--,1):(d=!1,f0&&e[i-1][2]>f;i--)e[i]=e[i-1];e[i]=[r,t,f]},o.n=e=>{var a=e&&e.__esModule?()=>e.default:()=>e;return o.d(a,{a:a}),a},r=Object.getPrototypeOf?e=>Object.getPrototypeOf(e):e=>e.__proto__,o.t=function(e,t){if(1&t&&(e=this(e)),8&t)return e;if("object"==typeof e&&e){if(4&t&&e.__esModule)return e;if(16&t&&"function"==typeof e.then)return e}var f=Object.create(null);o.r(f);var c={};a=a||[null,r({}),r([]),r(r)];for(var d=2&t&&e;"object"==typeof d&&!~a.indexOf(d);d=r(d))Object.getOwnPropertyNames(d).forEach((a=>c[a]=()=>e[a]));return c.default=()=>e,o.d(f,c),f},o.d=(e,a)=>{for(var r in a)o.o(a,r)&&!o.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:a[r]})},o.f={},o.e=e=>Promise.all(Object.keys(o.f).reduce(((a,r)=>(o.f[r](e,a),a)),[])),o.u=e=>"assets/js/"+({5:"68f6967e",53:"935f2afb",720:"4b1c66fd",1237:"6b9cf11d",1691:"4fbb7b2a",1862:"7f6d2349",1914:"d9f32620",2021:"9df216ac",2267:"59362658",2336:"fc2d5142",2535:"814f3328",2584:"cc6b848a",2907:"8a354aeb",3026:"1ee05011",3085:"1f391b9e",3089:"a6aa9e1f",3241:"4dd79207",3608:"9e4087bc",4013:"01a85c17",4195:"c4f5d8e4",4316:"2e9d9707",4781:"67819035",4942:"1a8fc9ba",5370:"ef8c40a5",5481:"cbf5fcec",5777:"78b543d2",5860:"d2e43329",6026:"02fbe9ca",6103:"ccc49370",6385:"77fbf8f1",6480:"19435779",7414:"393be207",7518:"4a0c03ec",7642:"2667c855",7643:"305cbda3",7918:"17896441",8610:"6875c492",8636:"f4f34a3a",9099:"b51e0dd8",9209:"336757ee",9301:"2573322b",9459:"16e31973",9514:"1be78505",9642:"7661071f",9671:"0e384e19",9906:"03e6874b"}[e]||e)+"."+{5:"dac034db",53:"af6e4ba6",720:"9eaa17d7",1237:"f6e28d40",1506:"d5e5f0dc",1691:"86c86d36",1862:"3ac43f79",1914:"b4ca5ec1",2021:"6332e529",2267:"482d3449",2336:"0c73c534",2529:"a61056b4",2535:"318c8932",2584:"5b8ce5d2",2907:"e81bae88",3026:"93a4d231",3085:"b156793e",3089:"407eb80e",3241:"36347b66",3608:"7aeff431",4013:"86f8d315",4195:"c40ce18f",4316:"905695f6",4781:"e7d3d22d",4942:"002624c2",4972:"e44a569c",5370:"e3b457d9",5481:"dd35331e",5777:"21a0ebf4",5860:"6f373289",6026:"83a32f1e",6103:"ed7197f6",6385:"13c6a529",6480:"0bfcab2e",7414:"527979f3",7518:"0e6a6cae",7642:"318e589a",7643:"b3abfe76",7918:"8ab55542",8610:"468d541a",8636:"ac5f507c",9099:"2ae7f368",9209:"2f263544",9301:"0f095ca2",9459:"b947a397",9514:"558272c1",9642:"296bcadc",9671:"1eb8bbef",9906:"2086ceda"}[e]+".js",o.miniCssF=e=>{},o.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),o.o=(e,a)=>Object.prototype.hasOwnProperty.call(e,a),t={},f="plasmo-co-learn:",o.l=(e,a,r,c)=>{if(t[e])t[e].push(a);else{var d,b;if(void 0!==r)for(var n=document.getElementsByTagName("script"),i=0;i{d.onerror=d.onload=null,clearTimeout(s);var f=t[e];if(delete t[e],d.parentNode&&d.parentNode.removeChild(d),f&&f.forEach((e=>e(r))),a)return a(r)},s=setTimeout(u.bind(null,void 0,{type:"timeout",target:d}),12e4);d.onerror=u.bind(null,d.onerror),d.onload=u.bind(null,d.onload),b&&document.head.appendChild(d)}},o.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o.p="/plasmo-co-learn/",o.gca=function(e){return e={17896441:"7918",19435779:"6480",59362658:"2267",67819035:"4781","68f6967e":"5","935f2afb":"53","4b1c66fd":"720","6b9cf11d":"1237","4fbb7b2a":"1691","7f6d2349":"1862",d9f32620:"1914","9df216ac":"2021",fc2d5142:"2336","814f3328":"2535",cc6b848a:"2584","8a354aeb":"2907","1ee05011":"3026","1f391b9e":"3085",a6aa9e1f:"3089","4dd79207":"3241","9e4087bc":"3608","01a85c17":"4013",c4f5d8e4:"4195","2e9d9707":"4316","1a8fc9ba":"4942",ef8c40a5:"5370",cbf5fcec:"5481","78b543d2":"5777",d2e43329:"5860","02fbe9ca":"6026",ccc49370:"6103","77fbf8f1":"6385","393be207":"7414","4a0c03ec":"7518","2667c855":"7642","305cbda3":"7643","6875c492":"8610",f4f34a3a:"8636",b51e0dd8:"9099","336757ee":"9209","2573322b":"9301","16e31973":"9459","1be78505":"9514","7661071f":"9642","0e384e19":"9671","03e6874b":"9906"}[e]||e,o.p+o.u(e)},(()=>{var e={1303:0,532:0};o.f.j=(a,r)=>{var t=o.o(e,a)?e[a]:void 0;if(0!==t)if(t)r.push(t[2]);else if(/^(1303|532)$/.test(a))e[a]=0;else{var f=new Promise(((r,f)=>t=e[a]=[r,f]));r.push(t[2]=f);var c=o.p+o.u(a),d=new Error;o.l(c,(r=>{if(o.o(e,a)&&(0!==(t=e[a])&&(e[a]=void 0),t)){var f=r&&("load"===r.type?"missing":r.type),c=r&&r.target&&r.target.src;d.message="Loading chunk "+a+" failed.\n("+f+": "+c+")",d.name="ChunkLoadError",d.type=f,d.request=c,t[1](d)}}),"chunk-"+a,a)}},o.O.j=a=>0===e[a];var a=(a,r)=>{var t,f,c=r[0],d=r[1],b=r[2],n=0;if(c.some((a=>0!==e[a]))){for(t in d)o.o(d,t)&&(o.m[t]=d[t]);if(b)var i=b(o)}for(a&&a(r);n 历史博文 | Plasmo-Co-Learn - + - + \ No newline at end of file diff --git a/blog/index.html b/blog/index.html index 7ac4b33..d386682 100644 --- a/blog/index.html +++ b/blog/index.html @@ -5,13 +5,13 @@ Blog | Plasmo-Co-Learn - +

· 阅读需 1 分钟
Endilie Yacop Sucipto

Docusaurus blogging features are powered by the blog plugin.

Simply add Markdown files (or folders) to the blog directory.

Regular blog authors can be added to authors.yml.

The blog post date can be extracted from filenames, such as:

  • 2019-05-30-welcome.md
  • 2019-05-30-welcome/index.md

A blog post folder can be convenient to co-locate blog post images:

Docusaurus Plushie

The blog supports tags as well!

And if you don't want a blog: just delete this directory, and use blog: false in your Docusaurus config.

- + \ No newline at end of file diff --git a/blog/mdx-blog-post/index.html b/blog/mdx-blog-post/index.html index 6831b61..717772e 100644 --- a/blog/mdx-blog-post/index.html +++ b/blog/mdx-blog-post/index.html @@ -5,13 +5,13 @@ MDX Blog Post | Plasmo-Co-Learn - +
- + \ No newline at end of file diff --git a/blog/tags/docusaurus/index.html b/blog/tags/docusaurus/index.html index b56a2e0..eb98927 100644 --- a/blog/tags/docusaurus/index.html +++ b/blog/tags/docusaurus/index.html @@ -5,13 +5,13 @@ 2 篇博文 含有标签「docusaurus」 | Plasmo-Co-Learn - +

2 篇博文 含有标签「docusaurus」

查看所有标签

· 阅读需 1 分钟
Endilie Yacop Sucipto

Docusaurus blogging features are powered by the blog plugin.

Simply add Markdown files (or folders) to the blog directory.

Regular blog authors can be added to authors.yml.

The blog post date can be extracted from filenames, such as:

  • 2019-05-30-welcome.md
  • 2019-05-30-welcome/index.md

A blog post folder can be convenient to co-locate blog post images:

Docusaurus Plushie

The blog supports tags as well!

And if you don't want a blog: just delete this directory, and use blog: false in your Docusaurus config.

- + \ No newline at end of file diff --git a/blog/tags/facebook/index.html b/blog/tags/facebook/index.html index 86836aa..0eccac6 100644 --- a/blog/tags/facebook/index.html +++ b/blog/tags/facebook/index.html @@ -5,13 +5,13 @@ 1 篇博文 含有标签「facebook」 | Plasmo-Co-Learn - +

1 篇博文 含有标签「facebook」

查看所有标签

· 阅读需 1 分钟
Endilie Yacop Sucipto

Docusaurus blogging features are powered by the blog plugin.

Simply add Markdown files (or folders) to the blog directory.

Regular blog authors can be added to authors.yml.

The blog post date can be extracted from filenames, such as:

  • 2019-05-30-welcome.md
  • 2019-05-30-welcome/index.md

A blog post folder can be convenient to co-locate blog post images:

Docusaurus Plushie

The blog supports tags as well!

And if you don't want a blog: just delete this directory, and use blog: false in your Docusaurus config.

- + \ No newline at end of file diff --git a/blog/tags/hello/index.html b/blog/tags/hello/index.html index e704dec..ba846fe 100644 --- a/blog/tags/hello/index.html +++ b/blog/tags/hello/index.html @@ -5,13 +5,13 @@ 1 篇博文 含有标签「hello」 | Plasmo-Co-Learn - +

1 篇博文 含有标签「hello」

查看所有标签

· 阅读需 1 分钟
Endilie Yacop Sucipto

Docusaurus blogging features are powered by the blog plugin.

Simply add Markdown files (or folders) to the blog directory.

Regular blog authors can be added to authors.yml.

The blog post date can be extracted from filenames, such as:

  • 2019-05-30-welcome.md
  • 2019-05-30-welcome/index.md

A blog post folder can be convenient to co-locate blog post images:

Docusaurus Plushie

The blog supports tags as well!

And if you don't want a blog: just delete this directory, and use blog: false in your Docusaurus config.

- + \ No newline at end of file diff --git a/blog/tags/index.html b/blog/tags/index.html index 4ca986a..92de3f4 100644 --- a/blog/tags/index.html +++ b/blog/tags/index.html @@ -5,13 +5,13 @@ 标签 | Plasmo-Co-Learn - + - + \ No newline at end of file diff --git a/blog/welcome/index.html b/blog/welcome/index.html index e96e691..558d8f8 100644 --- a/blog/welcome/index.html +++ b/blog/welcome/index.html @@ -5,13 +5,13 @@ Welcome | Plasmo-Co-Learn - +

Welcome

· 阅读需 1 分钟
Endilie Yacop Sucipto

Docusaurus blogging features are powered by the blog plugin.

Simply add Markdown files (or folders) to the blog directory.

Regular blog authors can be added to authors.yml.

The blog post date can be extracted from filenames, such as:

  • 2019-05-30-welcome.md
  • 2019-05-30-welcome/index.md

A blog post folder can be convenient to co-locate blog post images:

Docusaurus Plushie

The blog supports tags as well!

And if you don't want a blog: just delete this directory, and use blog: false in your Docusaurus config.

- + \ No newline at end of file diff --git a/docs/intro/index.html b/docs/intro/index.html index 413be24..d6d8736 100644 --- a/docs/intro/index.html +++ b/docs/intro/index.html @@ -5,14 +5,14 @@ 学前必读 | Plasmo-Co-Learn - +

学前必读

提示

这门课主要学习如何 plasmo 构建一个自己需要的浏览器扩展。 plasmo 是一个浏览器扩展的综合开发框架,他对浏览器扩展的各个组件进行了抽象封装,同时提供便捷的打包机制,极大的简化了浏览器扩展的开发。

学习这门课有什么用?

  1. 浏览器扩展可以通过脚本,打开当前访问互联网的另一个层面,可以作为一种轻量级的web3接入方案。
  2. 浏览器扩展的生命周期和安全范围,等同于浏览器本身,可以极大的扩展单个应用的局限性,自定义化的丰富web应用。
  3. 因浏览器扩展本身具有部分浏览器本地应用的安全属性,同时也可以给web应用提供安全性保障。

学习之前需要准备什么?

  1. 熟悉至少一种编程语言
  2. 熟悉至少一种前端架构 : React, Vue
  3. 熟悉 pnpm, yarn,npx 等前端操作工具链

参考资料

  1. plasmo 官方文档 https://docs.plasmo.com/
  2. 使用 plasmo 的参考示例https://github.com/PlasmoHQ/plasmo/network/dependents
  3. google Chrome 模块开发文档 https://developer.chrome.com/docs/extensions/mv3/
  4. Firefox 扩展开发文档 https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions
- + \ No newline at end of file diff --git a/docs/module1/basic_react/index.html b/docs/module1/basic_react/index.html index 7421e6a..d310b43 100644 --- a/docs/module1/basic_react/index.html +++ b/docs/module1/basic_react/index.html @@ -5,7 +5,7 @@ 10 分钟 React | Plasmo-Co-Learn - + @@ -18,7 +18,7 @@ 你应该看着很眼熟,内部基本上是类似 HTML 代码的模版结构。

组件参数

类似上边介绍的 App 组件,他在 main.tsx 中通过 HTML 标签的方式使用。那么怎么传递参数呢? 这个参数放在函数式组件的第一个参数 props,并且位置不可变。

function Example(props: any) {
return (
<p>{props.msg}</p>
)
}

export default Example;

以上定义了一个 Example 组件,接受任意类型的参数。

提示

Typescript 中类型不好标识,或者懒得设置的时候,可以使用 any 代替。 😄

使用方法也很简单。按需引入以后,直接使用 Example 标签即可。

<Example msg="hello world"/>

组件 hook

函数式组件,通过 useXXX 的方式,可以完成事件的相关绑定。

这里介绍两个重要的 hook:

用来做组件内的状态存储。

function Example() {
// Declare a new state variable, which we'll call "count"
const [count, setCount] = useState(0);

return (
<div>
<p>You clicked {count} times</p>
<button onClick={() => setCount(count + 1)}>
Click me
</button>
</div>
);
}

useState 接受一个参数,用来做状态数据的初始化,返回两个值。

  1. 一个值作为当前 state 的变量名(比如以上的 count),可以注入到返回的模版中,也可以在代码中使用。
  2. 另一个是状态变更的回调 (比如以上的 setCount) ,组件中可通过事件的处理比如 onClick 调用回调,改变组件状态。

这个相对复杂一些,标识当关注的状态变更的时候执行的业务逻辑。

function Example() {
// Declare a new state variable, which we'll call "count"
const [count, setCount] = useState(0);

useEffect(function(){
console.log(count);
},[count])

return (
<div>
<p>You clicked {count} times</p>
<button onClick={() => setCount(count + 1)}>
Click me
</button>
</div>
);
}

以上的代码表示,当状态数据 count 变更的时候,触发执行的逻辑。 如果关注的状态 count 为空,则表示,在组件加载的时候执行一次,可以理解为 onload。

路由组件

React 的一大场景是构建 SPA 应用(单页面应用)。这时候组件切换即成为一个问题。推荐大家使用

react router 来完成组件间的数据切换。

状态保存

单组件的状态可以使用 useState 来做,跨组件状态推荐使用 jotai 来做。

优化资源加载

react 应用中网络资源的加载,可以通过 react query 来做。

- + \ No newline at end of file diff --git a/docs/module1/first-extension/index.html b/docs/module1/first-extension/index.html index 6a5be8a..c1ffd6f 100644 --- a/docs/module1/first-extension/index.html +++ b/docs/module1/first-extension/index.html @@ -5,7 +5,7 @@ 开发你的第一个浏览器扩展 | Plasmo-Co-Learn - + @@ -15,7 +15,7 @@ 打开 chrome 浏览器的 扩展页面 : chrome://extensions ,按照下图开启 开发者模式

dev mode

通过选择加载已解压的扩展程序按钮,把开发调试的扩展加到浏览器中。

dev mode

最后,在浏览器中激活显示你自己的扩展。 show extension

做一些修改

打开 popup.tsx, 内容大致如下:

import { useState } from "react";

function IndexPopup() {
const [data, setData] = useState("");

return (
<div
style={{
display: "flex",
flexDirection: "column",
padding: 16,
}}
>
<h2>
Welcome to your
<a href="https://www.plasmo.com" target="_blank">
{" "}
Plasmo
</a> Extension!
</h2>
<input onChange={(e) => setData(e.target.value)} value={data} />
<a href="https://docs.plasmo.com" target="_blank">
View Docs
</a>
</div>
);
}

export default IndexPopup;

修改完成后,点击扩展图标,你将实时的看到你在 IDE 中做出的修改。

提示

pnpm create plasmo 可以配置初始化模板,列表在 example项目中。 比如: 使用 pnpm create plasmo --with-mui 你将初始化一个包含了 mui 界面库的扩展开发框架。

同时 : npmpnpm 传递参数的方式稍有不同。 按照如下方式配对:

pnpm create plasmo --with-env
# OR
npm create plasmo -- --with-env

打包预发布

使用 package.json 中定义的 build 文件,打包出 production的目录输出。

添加 package 脚本, 打包 zip 文件,可以分发或者上传到: Itero TestBed

"package": "plasmo build && plasmo package"
- + \ No newline at end of file diff --git a/docs/module1/index.html b/docs/module1/index.html index 67b9294..f1cb6f9 100644 --- a/docs/module1/index.html +++ b/docs/module1/index.html @@ -5,13 +5,13 @@ 模块介绍 | Plasmo-Co-Learn - + - + \ No newline at end of file diff --git a/docs/module1/introduction/index.html b/docs/module1/introduction/index.html index bf65b59..7b7b953 100644 --- a/docs/module1/introduction/index.html +++ b/docs/module1/introduction/index.html @@ -5,7 +5,7 @@ 欢迎来到 plasmo 的世界 | Plasmo-Co-Learn - + @@ -20,7 +20,7 @@ 接下来 Itero 帮你完成浏览器扩展的分发,直达测试用户。

Itero 提供如下的功能:

  • 更新完成后直达测试用户
  • Github 结合
  • 自动化的版本识别
提示

Itero 为收费功能,请在需要的时候使用。😄

PBB

这里是关于浏览器扩展发布的。Plasmo 提供了一个 Github Action。 https://github.com/marketplace/actions/browser-platform-publisher 通过相关的配置和管理, 你可以通过 Githut 一键发布你的浏览器扩展。

- + \ No newline at end of file diff --git a/docs/module2/assets/index.html b/docs/module2/assets/index.html index 9fa820c..de14d6f 100644 --- a/docs/module2/assets/index.html +++ b/docs/module2/assets/index.html @@ -5,13 +5,13 @@ 静态资源使用 | Plasmo-Co-Learn - + - + + \ No newline at end of file diff --git a/docs/module2/index.html b/docs/module2/index.html index 1800672..803121f 100644 --- a/docs/module2/index.html +++ b/docs/module2/index.html @@ -5,13 +5,13 @@ 模块介绍 | Plasmo-Co-Learn - + - + + \ No newline at end of file diff --git a/docs/module2/pages/index.html b/docs/module2/pages/index.html index 6c8a554..91037d6 100644 --- a/docs/module2/pages/index.html +++ b/docs/module2/pages/index.html @@ -3,14 +3,14 @@ -浏览器内置页面 | Plasmo-Co-Learn +扩展内置页面 | Plasmo-Co-Learn - +
-

浏览器内置页面

浏览器扩展包含几个内置页面,完成浏览器扩展本身的行为。他们包括以下几种 :

提示

开发内置页面的时候,请确保手工刷新浏览器扩展资源。因为,他们的运行环境,没有监听 web socket 的变化。

Popup Page 是我们开发浏览器扩展接触的第一个页面,他可以在用户点击浏览器扩展 icon 的时候弹出,触发。 +

扩展内置页面

浏览器扩展包含几个内置页面,完成浏览器扩展本身的行为。他们包括以下几种 :

提示

开发内置页面的时候,请确保手工刷新浏览器扩展资源。因为,他们的运行环境,没有监听 web socket 的变化。

Popup Page 是我们开发浏览器扩展接触的第一个页面,他可以在用户点击浏览器扩展 icon 的时候弹出,触发。 在 plasmo 目录创建 popup.tsx 或者 popup/index.tsx 。 其中导出的 React dom结构,会展示到 Popup Page

参考示例 with-popup

Options Page

Options Page 一般用于扩展本身的配置,右键点击扩展 icon ,选择 选项,将打开对应的页面。 在 plasmo 目录创建 options.tsx 或者 options/index.tsx 。 @@ -18,7 +18,7 @@ 有些浏览器会展示默认的页面,默认首页 等。

提示

各个 扩展之间的 这个选项会互相覆盖。

plasmo 目录创建 newtab.tsx 或者 newtab/index.tsx 。 其中导出的 React dom结构,会展示到 New Tab Page

参考示例 with-newtab

Dev Tools Page

这个页面会在浏览器调试 Panel 中展示。 在 plasmo 目录创建 devtools.tsx 或者 devtools/index.tsx

提示

这个和其他内置页面不太一样。创建 panlel 可能 需要 chrome.devtools 的相关 API 。

参考示例 with-devtools

- + \ No newline at end of file diff --git a/docs/module2/sandbox_pages/index.html b/docs/module2/sandbox_pages/index.html index bac1e7e..2fa44ff 100644 --- a/docs/module2/sandbox_pages/index.html +++ b/docs/module2/sandbox_pages/index.html @@ -5,13 +5,13 @@ sandbox pages | Plasmo-Co-Learn - + - +
+ \ No newline at end of file diff --git a/docs/module2/tab_pages/index.html b/docs/module2/tab_pages/index.html index 9da8fbe..9f26416 100644 --- a/docs/module2/tab_pages/index.html +++ b/docs/module2/tab_pages/index.html @@ -5,13 +5,13 @@ tab pages | Plasmo-Co-Learn - + - +
+ \ No newline at end of file diff --git a/docs/module2/workflow/index.html b/docs/module2/workflow/index.html index e2d3b1a..744e531 100644 --- a/docs/module2/workflow/index.html +++ b/docs/module2/workflow/index.html @@ -5,12 +5,12 @@ 开发工作流 | Plasmo-Co-Learn - +
-

开发工作流

这里主要介绍使用 plasmo 开发浏览器扩展的工作流。

创建项目

通过如下的命令创建 plasmo 项目:

pnpm create plasmo
# OR
yarn create plasmo
# OR
npm create plasmo

如果,跳过名字的提示,添加一个扩展的名字即可:

pnpm create plasmo "My Awesome Extension"
# OR
yarn create plasmo "My Awesome Extension"
# OR
npm create plasmo "My Awesome Extension"
提示

你也可以把 plasmo 安装为全局的对象 pnpm i -g plasmo

使用 src 作为源码目录

默认情况下,plasmo 使用当前项目的文件夹作为代码根目录。 创建项目的时候,使用 --with-src 参数即可

pnpm create plasmo --with-src
# OR
yarn create plasmo --with-src
# OR
npm create plasmo --with-src

如果你的项目已经创建好了,请按照如下的操作:

  1. 把所有的源码复制到 src 目录。 +

    开发工作流

    这里主要介绍使用 plasmo 开发浏览器扩展的工作流。

    创建项目

    通过如下的命令创建 plasmo 项目:

    pnpm create plasmo
    # OR
    yarn create plasmo
    # OR
    npm create plasmo

    如果,跳过名字的提示,添加一个扩展的名字即可:

    pnpm create plasmo "My Awesome Extension"
    # OR
    yarn create plasmo "My Awesome Extension"
    # OR
    npm create plasmo "My Awesome Extension"
    提示

    你也可以把 plasmo 安装为全局的对象 pnpm i -g plasmo

    使用 src 作为源码目录

    默认情况下,plasmo 使用当前项目的文件夹作为代码根目录。 创建项目的时候,使用 --with-src 参数即可

    pnpm create plasmo --with-src
    # OR
    yarn create plasmo --with-src
    # OR
    npm create plasmo --with-src

    如果你的项目已经创建好了,请按照如下的操作:

    1. 把所有的源码复制到 src 目录。 然后修改 tsconfig.json : 原来指向 ~* ,改为 ./src/*
    2. 修改 配置文件源码部分:
    {
    "extends": "plasmo/templates/tsconfig.base",
    "exclude": ["node_modules"],
    "include": [".plasmo/index.d.ts", "./**/*.ts", "./**/*.tsx"],
    "compilerOptions": {
    "paths": {
    "~*": ["./src/*"]
    },
    "baseUrl": "."
    }
    }

    指定入口文件

    默认的入口文件为 popup。 你可以使用 --entry 设置不同的入口。 这里列出了plasmo 支持的 entries

    pnpm create plasmo --entry=options,newtab,contents/inline
    # OR
    npm create plasmo -- --entry=options,newtab,contents/inline
    提示

    npm 不支持 向他的子命令直接传递参数,需要使用 -- 转移传递的参数。

    使用模板文件

    plasmo 官方提供了一个 模板列表。可以选择不同的模板类型初始化:

    pnpm create plasmo --with-env
    # OR
    npm create plasmo -- --with-env

    Development Sever

    使用如下的命令启动

    pnpm dev
    # OR
    npm run dev
    # OR
    plasmo dev

    Plasmo 将为您的扩展创建一个开发文件夹和一个实时重载开发服务器(一个 websocket 服务器),文件更改时自动更新您的开发文件夹。 @@ -19,8 +19,8 @@ 页面也会有所反馈。

  2. chrome-mv3-prod 这里为产品目录,与线上发布后的真实情况没有区别,也可以小范围使用分发测试。
提示

有时你无法在 chrome 中看到你的扩展。在 chrome 导航栏的设置中点开,选择 Pin 即可显示出来。 dev mode

选择一个指定的目标文件

我们使用 plasmo 开发框架,不只是一个 Chrome 扩展或者 Firefox 扩展。 他应该称之为 plasmo扩展。 这也意味着,你可以你可以打包出所有支持的浏览器。你可以使用 --target 参数来制定。

plasmo dev --target=firefox-mv2

支持的目标浏览器列表

去掉 source maps

source maps 为调制程序的时候,他会影响扩展的加载顺序。使用 --no-source-maps 去掉

plasmo dev --no-source-maps

指定 Server port 和 websocket

按照如下的命令修改 启动的 Server port 和 websocket 端口

plasmo dev --serve-host=localhost --serve-port-1012
plasmo dev --hmr-host=localhost --hmr-port=1815

发布一个产品包

常规的 build

产品包 build 命令

pnpm build
# OR
npm run build

生成 zip 包

pnpm package
# OR
npm run package

以上两步也可以合成一步

pnpm build --zip
# OR
npm run build -- --zip

设置目标

同 dev 一样,你可以使用 --target 设置目标

plasmo build --target=firefox-mv2

支持列表

添加自定义 tag

plasmo build --tag=staging

将会生成 build/chrome-mv3-staging 目录。

去掉 source maps

plasmo build --source-maps

其他优化

关闭 minification (一种代码压缩技术)

plasmo build --no-minify

启用 hoisting 的技术。 -在 JavaScript 和浏览器扩展开发中,hoisting 指的是提升模块依赖项的过程,使得被多个文件共同依赖的模块只需要加载一次。

plasmo build --hoist

以上的两个参数,可以组合使用。

- +在 JavaScript 和浏览器扩展开发中,hoisting 指的是提升模块依赖项的过程,使得被多个文件共同依赖的模块只需要加载一次。

plasmo build --hoist

以上的两个参数,可以组合使用。

+ \ No newline at end of file diff --git a/docs/module3/content/index.html b/docs/module3/content/index.html index 48da72b..91e35a9 100644 --- a/docs/module3/content/index.html +++ b/docs/module3/content/index.html @@ -5,13 +5,13 @@ Content Script | Plasmo-Co-Learn - + - + \ No newline at end of file diff --git a/docs/module3/contentui/index.html b/docs/module3/contentui/index.html index 4aee8cc..beac2bd 100644 --- a/docs/module3/contentui/index.html +++ b/docs/module3/contentui/index.html @@ -5,13 +5,13 @@ Content Script UI | Plasmo-Co-Learn - + - + \ No newline at end of file diff --git a/docs/module3/index.html b/docs/module3/index.html index 3081604..37a0ba2 100644 --- a/docs/module3/index.html +++ b/docs/module3/index.html @@ -5,13 +5,13 @@ 模块介绍 | Plasmo-Co-Learn - + - + \ No newline at end of file diff --git a/docs/module4/background/index.html b/docs/module4/background/index.html index f822c9d..0eccd18 100644 --- a/docs/module4/background/index.html +++ b/docs/module4/background/index.html @@ -5,13 +5,13 @@ Background Service Worker | Plasmo-Co-Learn - + - + \ No newline at end of file diff --git a/docs/module4/message/index.html b/docs/module4/message/index.html index 2155dc0..d06a442 100644 --- a/docs/module4/message/index.html +++ b/docs/module4/message/index.html @@ -5,13 +5,13 @@ Message API | Plasmo-Co-Learn - + - + \ No newline at end of file diff --git a/docs/module4/remote/index.html b/docs/module4/remote/index.html index ba65a7e..49bd1d9 100644 --- a/docs/module4/remote/index.html +++ b/docs/module4/remote/index.html @@ -5,13 +5,13 @@ Remote Code | Plasmo-Co-Learn - + - + \ No newline at end of file diff --git a/docs/module4/storage/index.html b/docs/module4/storage/index.html index 20bb46d..62b8316 100644 --- a/docs/module4/storage/index.html +++ b/docs/module4/storage/index.html @@ -5,13 +5,13 @@ Storage | Plasmo-Co-Learn - + - + \ No newline at end of file diff --git a/index.html b/index.html index 397371a..759c16b 100644 --- a/index.html +++ b/index.html @@ -5,13 +5,13 @@ Hello from Plasmo-Co-Learn | Plasmo-Co-Learn - +

Plasmo-Co-Learn

Build Browser Extension Is Very Easy!!

Powered by React

Powered by CreatorsDAO

- + \ No newline at end of file diff --git a/markdown-page/index.html b/markdown-page/index.html index ea282f5..ea5420b 100644 --- a/markdown-page/index.html +++ b/markdown-page/index.html @@ -5,13 +5,13 @@ Markdown page example | Plasmo-Co-Learn - +

Markdown page example

You don't need React to write simple standalone pages.

- + \ No newline at end of file