如何在create-react-app中删除导入的css？
在create-react-app中删除导入的CSS可以通过以下步骤实现：
- 打开你的React项目文件夹，在src目录下找到App.js文件（或者你想删除CSS的组件文件）。
- 在文件的顶部找到导入CSS的语句，通常是以
import关键字开头，后面跟着CSS文件的路径。例如：import './App.css'; - 将这行导入CSS的语句删除或注释掉（添加
//或/* */注释符号）。 - 保存文件并重新启动React开发服务器。
这样做可以确保在React应用程序中不再导入和使用该CSS文件。如果你想重新使用该CSS文件，只需取消注释或重新添加导入语句即可。
请注意，这种方法只适用于删除在组件中导入的CSS文件，而不是删除全局的CSS文件。如果你想删除全局的CSS文件，可以在项目的根目录中找到index.js文件，并删除或注释掉导入全局CSS的语句。
相关·内容
我使用npx create-react-app myapp --typescript创建了一个框架项目。
我更喜欢的css导入样式是import styles from './App.css，这样我就可以这样做了
<div className={styles.container}>Hello</div>
但是，如果我尝试这种风格，我会得到一个错误
Type error: Cannot find module './App.css'. TS2307
2 | import logo from './logo.svg';
浏览 0提问于2019-01-30得票数 1
我试图在我的create-react-app反应项目中开始使用scss而不是css。
我在用这个
现在我的package.json看起来像这样
"build-css": "node-sass-chokidar src/ -o src/",
"watch-css": "npm run build-css && node-sass-chokidar src/ -o src/ --watch --recursive",
"start-js": "react-scripts
浏览 0提问于2018-08-12得票数 1
希望启动一个创建反应应用程序(在vscode中)。我想使用一些基本的css重置代码开始清理。
问:在项目中放置css重置的最佳位置是哪里？
option a) in the `index.css` file auto generated via `create-react-app`
option b) in the `App.css` file auto generated via `create-react-app`
option c) any other best practice and/or recommendation
为了澄清，默认情况下，index.css和App.css位
浏览 1提问于2020-05-08得票数 0
回答已采纳
我正在尝试使用create-react-app来创建一个表，并且我想通过CDN加载依赖项。
我已经用简单的html/javascript成功地创建了这个表(见下文，)
<html>
<head>
<link href='https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css' rel='stylesheet'>
<script src="https://code.jquery.com/jquery-3.3.1.min.js&
浏览 2提问于2019-07-28得票数 1
是否每个react项目都是从带有旋转react徽标的react应用程序开始的，还是有其他方法可以删除样板文件？我想创建一个学习项目，我可以开始学习react钩子和所有的YouTube教程和其他方法，问题是我使用npx create-react-app my-app安装依赖项，现在当我试图删除CSS文件或任何其他我不需要的文件时，它在react中抛出一个错误，所以我的问题是，我可以安装依赖项而不使用经典的react旋转轮标志和其他东西来保持它们的干净吗？
浏览 6提问于2021-05-28得票数 0
使用: react 16.8.6。在开发模式下工作。 1) Do: npm create-react-app my-app 2) cd my-app 3)新增:导入"react-app-polyfill/ie11"；作为index.js中新的第一行 4) do: npm start 5)在Windows10上的IE11中，它会在控制台中中止，并显示以下内容： SCRIPT1002:语法错误1.chunk.js (10735,34) SCRIPT1002:语法错误main.chunk.js (154,1) 我尝试过其他的polyfills： 导入react-app-polyfi
浏览 53提问于2019-06-04得票数 3
回答已采纳
我使用create-react-app创建了一个应用程序。我正在通过配置webpack文件来使用CSS模块。当我使用reactstrap时，Bootstrap类出现了，但是样式没有应用。
遵循来自的说明
也导入了index.js文件中的CSS，但样式不适用。
{
test: /\.css$/,
use: [
require.resolve('style-loader'),
{
loader: require.resolve('css-
浏览 25提问于2018-09-05得票数 6
我刚刚在最新的Create-react-app版本中采用了TypeScript，似乎eslint要求我在导入ts文件时包含.ts：
import spacing from "../css/spacing"; // eslint complains can't resolved path
import spacing from "../css/spacing.ts"; // fine
有什么方法可以让.ts在导入时是可选的吗？
浏览 0提问于2018-11-09得票数 0
4回答
我正尝试在create-react-app上使用html和CSS模板。我可以将所有的HTML转换成JSX，没有任何问题，并且可以很好地呈现CSS。我不能得到与模板主页的脚本标签来工作
浏览 9提问于2019-02-01得票数 0
我对reactjs比较陌生，我是从create-react-app开始构建的。我似乎不能导入我的css，错误日志告诉我它是一个未闭合的字符串，但我看不出它是如何解开的。我看不出哪里出错了。
import React, { Component } from 'react';
import NavBar from './components/navbar';
import './css/style.css';
class App extends Component {
render() {
return (
<d
浏览 57提问于2018-03-28得票数 1
回答已采纳
当我尝试使用react执行three.js时，我就会遇到这个问题。它抛出三个没有定义的no-undef，如果我没有使用create-react-app，它可以很好地执行。但是，它使用create-react-app抛出了这个错误。
我在create-react-app中添加了我的3D场景，它抛出了一个错误: THREE is not defined no-undef。
在公共/ index.html内部
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
<link r
浏览 4提问于2017-11-18得票数 0
2回答
Sass不能在create-react-app中编译。当前的package.json结构是
{
"name": "create-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.3.1",
"react-dom": "^16.3.1",
"react-scripts": "1
浏览 3提问于2018-04-06得票数 3
回答已采纳
我的React的index.js，我使用了一个create-react-app starter项目。
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
ReactDOM.render(
<App />,
document.getElementById('root')
);
我的app.js包括：
导入'./App.css'；
我使用CSS：
.body {
backgr
浏览 15提问于2018-01-29得票数 3
回答已采纳
1回答
运行命令npx create-react-app projectName后，我收到此日志，但应用程序未创建。为什么会发生这个错误？
npx: installed 99 in 8.22s必须使用import加载ES模块:不支持ES模块的C:\Users\Roman\AppData\Roaming\npm-cache_npx\12568\node_modules\create-react-app\node_modules\is-promise\index.js require()。来自C:\Users\Roman\AppData\Roaming\npm-cache_npx\12568\node_m
浏览 0提问于2020-04-26得票数 0
我使用React.js创建了一个新的create-react-app应用程序。
对于每个组件(例如src/components/ComponentX.js)，我创建了一个单独的样式表(src/styles/ComponentX.css)，并按如下所示导入了它。
这反过来又为每个页面上的每个导入样式表创建了一个单独的<style>...</style>节。因此，样式表是全局的(这对SPA?)是有意义的，尽管不像描述的那样串连在一起。
在开发中，以这种方式表示依赖关系允许在编辑样式时动态地重新加载它们。在生产中，所有的CSS文件都将连接到构建输出中的一个缩小的.css文件
浏览 9提问于2022-01-20得票数 0
1回答
编辑:这个公认的答案帮助我找到了这个问题。它是正确的，所以我接受了它。但是我正在导入我的模块，其中包含了body标记，而不是使用它。
import styles from "./App.module.css"; //Includes a body tag
代码中没有使用styles，所以我认为WebPack没有包括它。如果我对这个模块做了什么，body标签就会被包括在内，而且它也能工作。<div className={styles.anything}>允许包含body CSS。
正如回答者在评论中所说，这可能是由于打字本造成的。
我用create-react-ap
浏览 2提问于2019-09-17得票数 5
回答已采纳
2回答
我想使用引导和其他jQuery插件(数据交换，旋转木马，.)在我使用create-react-app的React应用程序中。
下面是导入jQuery和引导程序的方法：
import React, { Component } from 'react';
import 'bootstrap/dist/css/bootstrap.min.css';
import $ from 'jquery';
window.jQuery = window.$ = $;
import 'bootstrap/dist/js/bootstrap.min';
浏览 3提问于2017-05-20得票数 12
回答已采纳
2回答
我用create-react-app project_name创建了一个项目，然后尝试在css background-image: url('/images/ernestDrum.jpeg');中使用公用文件夹中的图像作为背景。
然后我在我的上一个项目中得到了这个错误./src/App.css (./node_modules/css-loader/dist/cjs.js??ref--5-oneOf-4-1!./node_modules/postcss-loader/src??postcss!./src/App.css) Error: Can't resolve '
浏览 6提问于2020-10-31得票数 0
回答已采纳
1回答
我使用create-react-app创建了一个react项目，并使用这个文件夹结构：
钢筋混凝土/
组件/
菜单/
Menu.scss
- Global/
- fonts/
- _myfont.ttf_
- _etc..._
- _myfont.scss_
在Menu.scss中，我使用@import '../../Global/myfont';导入。
在myfont.scss中，我包括字体面板：
@font-face {
font-family:
浏览 3提问于2016-12-31得票数 4
回答已采纳
4回答
我是F2E世界的新手。我刚刚创建了一个使用的web应用程序。()
我希望将owl.carousel导入到我的项目中，以便遵循NPM ()的指导，其中的语法如下：
import $ from 'jquery';
import 'imports?jQuery=jquery!owl.carousel';
但是调试器控制台指出了错误：
Unexpected '!' in 'imports?jQuery=jquery!owl.carousel'. Do not use import syntax to configure webp
浏览 6提问于2016-11-08得票数 6
回答已采纳
在React应用程序中，我们通常将CSS文件导入到JavaScript组件中。我认为这样我们就可以将CSS注入到最终的JavaScript构建中。
但是，React (至少是create-react-app)似乎仍然生成单独的CSS文件。
为什么会这样呢？有没有办法强迫CSS样式成为最终r的一部分？有点？
浏览 1提问于2019-11-03得票数 1
Reactjs的工程结构如下： ->public
->background.jpg
->src
->App.js
->App.css 我尝试在App.css中加载background.jpg，如下所示：background-image: url("../public/background.jpg"); 但是图像不会被导入。相反，它说src之外的导入是不允许的。 如何解决此问题？ create-react-app版本: 3.4.0
浏览 10提问于2021-11-04得票数 0
1回答
我已经用Express建立了一个网站，我只想在一些页面中使用React。使用create-react-app添加所有资源的最佳方式是什么？ 我知道我可以将每个脚本添加到HTML文件中，但这很容易出错，而且很费力。我只是希望能够像使用create-react-app的应用程序一样执行所有的导入和管理文件。
浏览 27提问于2020-04-22得票数 2
回答已采纳
我使用create-react-app作为初学者工具包，并尝试使用antd组件库。
我似乎找不到一种方法来定制他们的风格(出于品牌目的)。文档似乎没有给出关于定制的明确方向。
文档链接：
不过，他们提出了两种方法：
1.使用theme属性。但这只适用于antd-init或dva-cli样板文件，而不适用于create-react-app
2.覆盖Less变量。
现在，要让这两个选项中的任何一个在没有eject的create-react-app上工作，我需要采取哪些步骤？
浏览 0提问于2017-06-18得票数 1
我正在尝试在我的create-react-app项目中包含一些CSS。CSS来自第三方NPM包，因此它位于node_modules目录中。
我试过了：import '/node_modules/packagename/css/styles.css';
但是我得到了一个错误：
找不到模块:您试图导入位于项目src/目录之外的/node_modules/packagename/css/styles.css。不支持src/外部的相对导入。您可以将其移动到src/内，或者从项目的node_modules/添加一个指向它的符号链接。
我不希望将CSS移动到src/，这样它就可以通过NP
浏览 132提问于2017-08-13得票数 51
回答已采纳
我需要在一些项目中使用bootstrap，我遇到的一个问题是，出于某种原因，bootstrap样式表优先于样式化的组件样式。 import "bootstrap/dist/css/bootstrap.
const StyledButton = styled(Button)`
background: blue;
`; 预期结果:在我的组件中使用background指定字段实际结果: StyledButton具有默认引导程序背景 示例如下：https://codesandbox.io/s/p2wz01wnz7 我目前在我的index.js中导入bootstrap，如下所示： impo
浏览 29提问于2019-03-30得票数 1
我已经使用Visual Studio2017 for .NET Core中的React模板创建了一个SPA。我很乐意编辑打字脚本并创建新组件，但我希望能够配置某些设置，例如API地址。我发现create-react-app使用了环境变量，这正是我想要的。所以我使用了create-react-app，并在我的项目目录中添加了一个带有REACT_APP_SETTING设置的.env文件。无法在组件中使用{process.env.REACT_APP_SETTING}访问变量。已返回到默认SPA模板(即不是直接由create-react-app创建)并安装了dotenv。我在根目录(我的.csproj
浏览 0提问于2018-07-17得票数 2
回答已采纳
在安装create-react-app时，我在启动开发服务器(npm start )时收到以下错误： ./src/index.css (./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-3-1!./node_modules/postcss-loader/src??postcss!./src/index.css)
Error: No valid exports main found for 'myproject\node_modules\colorette' 我已经用create-react-app -g全局重新安装了cre
浏览 49提问于2020-07-06得票数 28
回答已采纳
我使用create-react-app模板生成了一个使用TypeScript的React项目。我已经通过npm install sass安装了Sass，而生成的模板已经支持CSS模块。
我在styles/common.scss文件中创建了一组公共变量。我希望导入并使用组件样式表中的文件中的变量。建议的方法似乎是@use指令，但我无法开始工作。
我的项目结构中的相关文件：
components/
custom/
Custom.module.scss
Custom.tsx
styles/
common.scss
在这个场景中，components/custom/Custom
浏览 7提问于2022-09-09得票数 0
回答已采纳
1回答
在我的React项目中，我想使用更少的css模块。
我的css的webpack配置是：
{
test: /\.(?:le|c)ss$/,
use: [
require.resolve('style-loader'),
{
loader: require.resolve('css-loader'),
options: {
imp
浏览 4提问于2018-08-04得票数 1
3回答
希望使用以下构建包在Heroku上部署create-react-app配置：
我注意到我有一个更大的425kb的构建在gZipped之后，我的网站在初始加载上非常慢
是以下步骤，是否有足够好的措施来减少包大小？(即)最好的敲竹杠)。如果没有，你还会推荐什么呢？-我还没有这么做：
在我可以使用的地方进行代码拆分，并使用 (可能使用)
确保我只加载所需的模块(即。import { map } from 'lodash/map';)。
其他解决方案我不愿意做
使用，因为我不想破坏事物:)
--看起来这需要弹射，我很好奇这是否值得？
也就是说，它增加
浏览 3提问于2018-05-01得票数 6
回答已采纳
我正在尝试将jquery模块select2添加到我的react项目中，该项目是由create-react-app创建的。
我在跑步
npm install --save select2
并且可以看到依赖项已正确添加到我的package.json中。
然后，我将其添加到react-code之外的全局javascript-file中：
$(function () {
$('select').select2();
});
这不起作用，因为不包括select2脚本。
我做错了什么？我应该以某种方式在react代码中运行jquery代码吗？我应该做一些具体的事情来包含selec
浏览 0提问于2016-12-20得票数 1
以前，我是这样在style.less中导入引导程序的(不使用js框架)：
@import "bootstrap/less/bootstrap.less";
@import "variables.less";
@import "mixins.less";
@import "main.less";
...
现在，我使用create-react-app，对每个组件使用单独的文件夹，每个组件都是单独的was文件(我被告知这是最好的方法之一)。
├── components
│ ├── About
│ │ ├── index.j
浏览 3提问于2017-10-02得票数 5
我有一个项目要从遗留的React应用程序迁移到标准的create-react-app应用程序(不是弹出的)。 在遗留项目中，使用dotenv和dotenv-expand手动加载.env文件，并通过webpack DefinePlugin注入。 create-react-app直观地支持dotenv，但只能识别带有REACT_APP_前缀的变量。 在使用process.env.xxx变量的其他存储库中，遗留代码以及导入的包中有很多地方，因此在迁移之前不可能使用前缀对它们进行重命名。 在这种情况下，如何让create-react-app识别没有REACT_APP_前缀的dotenv变量？ 顺便说
浏览 71提问于2020-04-24得票数 5
回答已采纳
我的React项目(用create-react-app制作)在我开始项目之前就被弹出了。我在webpack文件中包含了一个SCSS加载器。
现在，当我尝试运行'npm run build‘时，显示以下错误：
Invalid CSS after "i": expected 1 selector or at-rule, was "import React from '"
浏览 0提问于2018-06-17得票数 1
我使用以下命令安装了React.js：
create-react-app my-app
现在打开命令行，执行以下命令：
npm start
该应用程序在我的浏览器中以以下URL打开：
http://localhost:3000/
现在我转到public/src/app.js文件夹，并从以下代码中更改代码：
import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
class App extends Component
浏览 4提问于2017-10-02得票数 3
回答已采纳
我已经在我的电脑上安装了nodejs和yarn (Linux Deepin)。我还全局安装了create-react-app。但是，create-react-app命令未运行。我一直收到错误: bash: create-react-app: command not found。
我是不是遗漏了什么配置？因为我已经看到了全局安装的create-react-app。
NodeJS - v6.3.1纱线- 1.6.0操作系统版本Linux Deepin -15
浏览 1提问于2018-05-21得票数 1
问题: react的相对初学者，喜欢使用create-react-app而不弹出或配置webpack，并希望实现SASS，最好使用7-1文件夹结构。我想要的是组件的独立样式表，但也有布局等全局样式表等。最重要的是，我想要有SASS变量和混合，我可以在我的所有组件中使用。
我尝试过的: 1) Node-sass-chokidar (在package.json中添加一些脚本，以便在运行npm start时自动运行css-watch，按照github.facebookincubator/create-react-app上的说明。)
Node-sass-chokidar在src目录中查找任何scss文
浏览 3提问于2017-10-03得票数 2
我学会用打字稿来反应。在中，我看到它使用--scripts-version参数创建新应用程序：
create-react-app my-app --scripts-version=react-scripts-ts
此外，我还看到create-react-app有--typescript选项。所以，我可以写：
create-react-app my-app --typescript
这些基于反应的应用程序创建方法有什么不同？指定这两个参数有意义吗？也就是说。
create-react-app my-app --typescript --scripts-version=react-scripts-
浏览 1提问于2019-02-09得票数 1
回答已采纳
4回答
有没有人能告诉我是否值得在React中使用Sass/SCSS？
我最终将SCSS设置为在不弹出的情况下使用Create-React-App，但它似乎不能很好地工作，因为建议对每个组件使用CSS模块。
我该如何去共享变量，混合，等等。仅仅使用CSS是不是更好？
任何帮助都将不胜感激。
浏览 1提问于2018-04-17得票数 4
我只是使用create-react-app创建了一个React项目，在设置之后，我得到了以下错误：
Failed to compile.
Module not found: Error: Can't resolve 'App' in 'C:\Development_Projects\international-school-fe\src'
ERROR in ./src/index.tsx 4:0-22
Module not found: Error: Can't resolve 'App' in 'C:\Developm
浏览 7提问于2022-07-07得票数 0
1回答
我在create-react-app中使用Material，并且在抽屉标题中呈现.svg文件有困难。我得到一个破碎的图像渲染，而不是我所期望的.svg。任何帮助都将不胜感激。谢谢!
<DrawerHeader>
<div>
<Icon classes={{root: classes.iconRoot}}>
<img className={classes.imageIcon} src="/assets/logo.svg"/>
</Icon>
</div>
浏览 3提问于2022-03-19得票数 0
回答已采纳
1回答
我正在使用create-react-app构建一个react web应用程序。
如你所知，create-react-app上有默认的webpack设置。它有与css-loader相关的设置，特别是webpack.config.prod.js有如下css-loader设置。
{
test: /\.css$/,
loader: ExtractTextPlugin.extract(
Object.assign({
fallback: {
loader: require.resolve('s
浏览 1提问于2018-06-18得票数 0
1回答
我在我的ReactJS应用程序中与ReactJS一起使用TypeScript，我想导入一个在另一个项目中创建的类型记录/JavaScript模块。
该模块由一个文件mymodule.js组成，其中的代码大致如下所示：
var mymodule;
(function (mymodule) {
var MyClass = /** @class */ (function () {
function MyClass() {
}
MyClass.myMethod = function () {
// code
浏览 1提问于2020-01-15得票数 0
我正在尝试合并一个HTML/CSS管理模板，我已经在网上购买，到我的CRA应用程序。 问题是，当我将该模板的CSS添加到header部分内的index.html中时，CSS文件不存在，服务器返回主页。 我知道SPA需要此行为，服务器应返回所有路由的主页，因为路由是在客户端处理的，但在这种情况下，我需要暂时禁用此功能，并要求服务器在找不到资源时返回404。 如何在create-react-app中完成？
浏览 13提问于2021-07-27得票数 0
1回答
我最近弹出了我的create-react-app，因为我需要加载sass文件。不幸的是，create-react-app使用的是webpack 1。但是，当前版本的sass-loader包含了对webpack 2的依赖。支持文档中没有指明支持webpack 1的最新sass-loader版本。谁知道我在哪里可以找到这个信息？
浏览 7提问于2017-02-24得票数 0
回答已采纳
1回答
我有一个文件，我在其中导入了一些css (通过raw-loader)，并将其放在文档头的样式标签中，然后默认导出相应的react-component。
// Swiper.js
import swiperStyles from '!!raw-loader!swiper/dist/css/swiper.min.css';
const swiperElement = document.createElement('style');
swiperElement.innerHTML = swiperStyles;
document.head.append(swipe
浏览 23提问于2019-07-09得票数 0
1回答
我想把css模块安装到create-react-app中，我偶然发现了这个。
设置后，我在我的文件夹中创建了一个测试style.module.css文件，并使用import styles from './style.module.css';导入它，如下所示：
import React, { Component } from 'react';
import styles from './style.module.css';
console.log(styles); //returns '/static/media/style.module
浏览 2提问于2018-04-06得票数 0
1回答
CRA和捆绑装载机
、、、、
我正试图在我的react-router应用程序中与一起使用create-react-app。
import loadSettings from 'bundle-loader?lazy!./Settings';
这一行得到了我的错误：
Line 5: Unexpected '!' in 'bundle-loader?lazy!./Settings'. Do not use import syntax to configure webpack loaders import/no-webpack-loader-syntax
我想这是因为一些es-
浏览 6提问于2017-05-22得票数 0
在我工作过的更早的React应用程序中，我可以直接使用Babel/Webpack，我能够做到：
import React from 'react';
global.React = React;
// rest of my imports
因此，消除了代码库中的每个文件都具有相同的冗余和无意义导入的需要。
然而，当我尝试用一个create-react-app应用程序做同样的技巧时，它对我试图“在身体中导入”很生气，因为global.React = React行之后的导入。
因此，我的问题是，在create-react-app中是否可能以某种方式将自身设置为一个全局变量，这样就不必
浏览 3提问于2020-03-11得票数 1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储活动推荐
腾讯云开发者
