0

我用包裹捆绑器构建了一个反应小部件。网站和它的 JavaScript 功能可以工作,但 CSS 没有加载,所以它看起来很丑。我尝试了几种方法,但 CSS 不起作用。

*这是我的包 Json

{
  "name": "9jakids-project",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@craco/craco": "^6.4.0",
    "@testing-library/jest-dom": "^5.12.0",
    "@testing-library/react": "^11.2.7",
    "@testing-library/user-event": "^12.8.3",
    "node-sass": "^6.0.0",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-modal": "^3.14.3",
    "react-redux": "^7.2.5",
    "react-responsive-modal": "^6.1.0",
    "react-scripts": "4.0.3",
    "redux": "^4.1.1",
    "web-vitals": "^1.1.2"
  },
  "scripts": {
    "eject": "react-scripts eject",
    "start": "craco start",
    "build": "craco build",
    "test": "craco test",
    "build:widget": "parcel build src/index.js --no-source-maps -d widget"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "parcel-bundler": "^1.12.5"
  }
}

我也有一个 craco.config.js 文件,但它是空的。

这是它嵌入的站点

这是可嵌入的链接。

     <div id="lukman-test"></div>

    <link href="https://test-royal.000webhostapp.com/widget/index.css" rel="stylesheet" />
    <script src="https://test-royal.000webhostapp.com/widget/index.js"></script>
4

0 回答 0