小编Min*_*ark的帖子

Chrome 扩展程序导致“未捕获(承诺)错误:无法访问 chrome:// URL”

我正在关注 chrome 官方网站https://developer.chrome.com/docs/extensions/mv3/getstarted/中发布的如何使 chrome 扩展入门

我复制并粘贴了所有代码并以相同的方式运行。但就我而言,当我运行时chrome.scripting.executeScript,它会导致"Uncaught (in promise) Error: Cannot access a chrome:// URL"错误。

我不知道有什么问题。这是我从上面的链接复制的代码。

  • 清单.json
{
  "name": "Getting Started Example",
  "description": "Build an Extension!",
  "version": "1.0",
  "manifest_version": 3,
  "background": {
    "service_worker": "background.js"
  },
  "permissions": ["storage", "activeTab", "scripting"],
  "action": {
    "default_popup": "popup.html",
    "default_icon": {
      "16": "/images/get_started16.png",
      "32": "/images/get_started32.png",
      "48": "/images/get_started48.png",
      "128": "/images/get_started128.png"
    }
  },
  "icons": {
    "16": "/images/get_started16.png",
    "32": "/images/get_started32.png",
    "48": "/images/get_started48.png",
    "128": "/images/get_started128.png"
  }
}
Run Code Online (Sandbox Code Playgroud)
  • 背景.js
let color = '#3aa757';

chrome.runtime.onInstalled.addListener(() => {
  chrome.storage.sync.set({ …
Run Code Online (Sandbox Code Playgroud)

google-chrome google-chrome-extension chrome-extension-manifest-v3

12
推荐指数
2
解决办法
2万
查看次数

将全局 scss 与 storybook 结合使用

我是 Storybook 的新手。

我有一个.scss用于全局的文件。我想从故事书中导入这个文件。

所以我制作了 .storybook/config.js 文件并在里面导入了 scss 。但它显示了我的错误。

错误

ERROR in ./styles/style.scss (./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./node_modules/style-loader/dist/cjs.js!./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/src!./node_modules/sass-loader/dist/cjs.js!./node_modules/sas
s-resources-loader/lib/loader.js!./styles/style.scss)
Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Invalid CSS after "v": expected 1 selector or at-rule, was 'var api = require("'
        on line 1 of C:\Users\Walter\WebstormProjects\closet-next\styles\style.scss
>> var api = require("!../node_modules/style-loader/dist/runtime/injectStylesIn
   ^

 @ ./styles/style.scss 2:26-346 43:4-64:5 46:18-338
 @ ./.storybook/config.js
 @ multi ./node_modules/@storybook/core/dist/server/common/polyfills.js ./node_modules/@storybook/core/dist/server/preview/globals.js ./node_modules/@storybook/addon-docs/dist/frameworks/common/config.js ./node_modules/@storybook/addon-docs/dist/frameworks/react/config.js ./.
storybook/config.js ./node_modules/@storybook/addon-knobs/dist/preset/addDecorator.js ./.storybook/generated-entry.js (webpack)-hot-middleware/client.js?reload=true&quiet=true

Run Code Online (Sandbox Code Playgroud)

什么是问题?这是 main.js

主文件

const path = require('path');

module.exports = {
  stories: ['../stories/**/*.stories.(js|mdx|tsx)'],
  addons: [ …
Run Code Online (Sandbox Code Playgroud)

javascript storybook

9
推荐指数
2
解决办法
7544
查看次数

如何使用 nextjs 将 React 应用程序成功部署到 AWS Amplify?

我是aws的新手。我尝试将我的简单 React 应用程序部署到 aws 放大前端服务器。

我的应用程序已成功构建,但我的页面显示“拒绝访问”

<Error>
 <Code>AccessDenied</Code>
 <Message>Access Denied</Message>
 <RequestId>C82A3C87F1F61733</RequestId>
 <HostId>Dra3fQ4LWJQVgGKKcF/EssjEAEHjYt1FuVQRI9pa+CA5L+Bgwl0hArw/EZEIhjg0d4qZ8DxMsLg=</HostId>
</Error>
Run Code Online (Sandbox Code Playgroud)

我不知道为什么。你能给我一个提示来解决这个问题吗?

这是一些信息。

包.json

{
  "name": "react-env-setting",
  "version": "1.0.0",
  "description": "practice for react env setting with scss, nextjs",
  "main": "index.js",
  "scripts": {
    "build": "next build",
    "start": "next start",
    "dev": "next",
    "test": "jest --verbose --watchAll"
  },
  "author": "reallifeliver",
  "license": "ISC",
  "dependencies": {
    "@babel/preset-typescript": "^7.10.1",
    "@types/node": "^14.0.9",
    "@types/react": "^16.9.35",
    "@types/react-dom": "^16.9.8",
    "@zeit/next-sass": "^1.0.1",
    "@zeit/next-typescript": "^1.1.1",
    "awesome-typescript-loader": "^5.2.1",
    "css-loader": "^3.5.3",
    "dotenv": "^8.2.0",
    "eslint": "^7.1.0",
    "next": "^9.4.4",
    "path": "^0.12.7",
    "react": "^16.13.1",
    "react-dom": …
Run Code Online (Sandbox Code Playgroud)

amazon-web-services reactjs next.js aws-amplify

4
推荐指数
1
解决办法
3652
查看次数

为什么我的简单反应组件打印控制台两次?

我制作了一个简单的组件,当单击按钮时,数字状态“a”会增加。

console.log()在组件内部编写以检查它何时呈现。我希望在console.log单击按钮时执行一次,因为组件的状态已更改。

但是,我错了,console.log()被执行了两次。

有什么问题吗?还是正确的?我错过了什么?

这是我的代码

jsx

import React, {useState} from 'react';

const A = () => {
    const [a, setA] = useState(0);
    const onClick = () => setA(a + 1);
    console.log('render')

    return (
        <div>
            <p>a : { a}</p>
            <button onClick = {onClick}>button</button>
        </div>
    )
}

export default A;
Run Code Online (Sandbox Code Playgroud)

索引.jsx

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import A from './components/A';
import * as serviceWorker from './serviceWorker';

ReactDOM.render(
  <React.StrictMode>
    <A …
Run Code Online (Sandbox Code Playgroud)

reactjs

3
推荐指数
1
解决办法
1089
查看次数

如何使用 Base64 编码图像作为 img 标签的来源?

现在,我正在使用 BASE64 制作缩略图页面。

我将图像存储在服务器上,并在客户端将它们作为 Base64 回调。

我想使用这些 Base 64 编码的 Img 作为 src。它运作良好

. 但是,我犯了这样的错误

GET http://localhost:8080/%7B%7Bitem.THUMBNAIL%7D%7D 404
Run Code Online (Sandbox Code Playgroud)

什么是问题?并且在没有任何转换的情况下使用base64作为src是正确的方法吗?

这是我的来源

脚本

   $http.get( "app/dashboard/recentWithInfo").then( function( rtn) {
            rtn.data.map( item => {

                if( item.THUMBNAIL){
                    item.THUMBNAIL = "data:image/png;base64," +item.THUMBNAIL.body;
                }
            })
            $scope.items = rtn.data;
        });
Run Code Online (Sandbox Code Playgroud)

HTML

 <img class="block-thumbnail-img" ng-if="item.THUMBNAIL != null" src="{{item.THUMBNAIL}}">
 <h2 ng-if="item.THUMBNAIL == null" style="color:#ccc"> No THUMBNAIL</h2>
Run Code Online (Sandbox Code Playgroud)

此外,我使用 Springboot 和 AngularJS。提前致谢!

html base64 image angularjs

2
推荐指数
1
解决办法
6434
查看次数