具体错误

ERROR in ./src/index.tsx
Module build failed (from ./node_modules/css-loader/dist/cjs.js):
CssSyntaxError
(2:1) Unknown word
var content = require("!!./index.tsx");
if(typeof content === 'string') content = [[module.id, content, '']]

webpack.config.js

const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
function resolve(dir) {
return path.join(__dirname, dir);
}
module.exports = {
entry: path.join(__dirname, "../src/index.tsx"),
output: {
filename: "bundle.js",
path: path.join(__dirname, "dist")
},
module: {
rules: [
{
test: /\.js$/,
use: ["babel-loader"],
include: path.join(__dirname, "src")
},
{
test: /\.tsx?$/,
exclude: /node_modules/,
use: ["ts-loader", "babel-loader", "css-loader", "style-loader"]
},
{
test: /\.(s*)css$/, // 正则匹配文件路径
exclude: /node_modules/,
use: ["css-loader", "style-loader"]
}
]
},
resolve: {
extensions: [".tsx", ".ts", ".js", ".jsx", ".css", ".scss"]
},
// ...
};

解决方法

在添加ts编译模块的时候仅留下'ts-loader',即

  {
test: /\.tsx?$/,
exclude: /node_modules/,
use: ["ts-loader"]
},

具体原因

待补充

初始化构建React+Ts项目时出现:Module build failed (from ./node_modules/css-loader/dist/cjs.js): CssSyntaxError的更多相关文章

  1. webpack命令:Module build failed(from ./node_modules/babel-loader/lib/index.js)/405/错误解决

    在项目中运行的时候出现报错,错误为Module build failed (from ./node_modules/babel-loader/lib/index.js) 解决方案: 控制台输入  np ...

  2. webpack 命令 Module build failed (from ./node_modules/babel-loader/lib/index.js) 错误问题解决方案

    在项目中运行的时候出现报错,错误为Module build failed (from ./node_modules/babel-loader/lib/index.js) 解决方案: 控制台输入  np ...

  3. webpack报错:Module build failed (from ./node_modules/babel-loader/lib/index.js): Error: Cannot find module 'babel-preset-env' from '...' - Did you mean "@babel/env"?

    webpack报错:Module build failed (from ./node_modules/babel-loader/lib/index.js): Error: Cannot find mo ...

  4. 【Problem】前端项目运行:Module build failed:Error Node Sass does not yet support my current environmen

    我在运行renren-fast-vue前端项目时,安装完依赖cnpm install 启动服务npm run dev 出现问题. Module build failed: Error: Node Sa ...

  5. webpack搭建项目时出现的报错“Module build failed (from ./node_modules/css-loader/dist/cjs.js) CssSyntaxError”

    控制台出现的错误如下: webpack.config.js中的配置如下: module.exports={ entry:'./src/main.js', output:{ path:__dirname ...

  6. JS/TS项目里的Module都是什么?

    摘要:在日常进行JS/TS项目开发的时候,经常会遇到require某个依赖和module.exports来定义某个函数的情况.就很好奇Modules都代表什么和有什么作用呢. 本文分享自华为云社区&l ...

  7. Vue使用Typescript开发编译时提示“ERROR in ./src/main.ts Module build failed: TypeError: Cannot read property 'afterCompile' of undefined”的解决方法

    使用Typescript开发Vue,一切准备就绪.但npm start 时,提示“ ERROR in ./src/main.tsModule build failed: TypeError: Cann ...

  8. vue项目报错,解决Module build failed: Error: Cannot find module 'node-sass' 问题

    1.报错问题 1 E:\WebStormFile\treehole-manage>npm run dev > xc-ui-pc-sysmanage@1.0.0 dev E:\WebStor ...

  9. Module build failed: Error: Cannot find module 'url-loader' 的坑

    本文地址:http://www.cnblogs.com/jying/p/8280956.html 开发环境:react.webpack.es5 引用图片报错:Module build failed: ...

随机推荐

  1. Aspect切面的使用实例

    一.导入切面库 以maven工程为例,除了springmvc基础的库,需要导入切面库,本例aspectj为例. <properties> <aspectj.version>&l ...

  2. accept 和 content-Type区别

    accept表示 客服端(浏览器)支持的类型,也是希望服务器响应发送回来的的数据类型. 例如:Accept:text/xml; ,也就是希望服务器响应发送回来的是xml文本格式的内容 区别: 1.Ac ...

  3. [LeetCode] 257. Binary Tree Paths 二叉树路径

    Given a binary tree, return all root-to-leaf paths. For example, given the following binary tree: 1 ...

  4. 使用 Consul 作为 Python 微服务的配置中心

    使用 Consul 作为 Python 微服务的配置中心 Consul 作为数据中心,提供了 k/v 存储的功能,我们可以利用这个功能为 Python 微服务提供配置中心. Consul 提供了 HT ...

  5. K8S+GitLab+.net core-自动化分布式部署-1

    K8S+GitLab-自动化分布式部署ASP.NET Core(一) 部署环境 一.部署流程介绍 开发人员通过Git上传asp.net core 项目到Gilab,并编写好.gitlab-ci.yml ...

  6. Java开发笔记(一百三十七)JavaFX的标签

    前面介绍了JavaFX的窗口框架,其中舞台.场景.窗格都能与AWT/Swing体系的相关概念一一对应,不仅如此,JavaFX的常见控件也能在Swing中找到相应的控件.比如JavaFX的按钮控件名叫B ...

  7. Linux环境下错误码及意义总结

    Linux的错误码包含在/usr/include/asm-generic/errno-base.h和/usr/include/asm-generic/errno.h 这两个文件内: #ifndef _ ...

  8. Charles4.2.8抓包(http+https)

    Charles 和 Fiddler 一样都是http抓包工具. 之前用 Fiddler 抓个别 ios 手机 https 报文时总卡在哪里返不回任何数据,后来怀疑是 Fiddler 问题,就考虑使用  ...

  9. Different Subsets For All Tuples CodeForces - 660E (组合计数)

    大意: 定义$f(a)$表示序列$a$本质不同子序列个数. 给定$n,m$, 求所有长$n$元素范围$[1,m]$的序列的$f$值之和. 显然长度相同的子序列贡献是相同的. 不考虑空串, 假设长$x$ ...

  10. @PostConstruct使用总结

    https://blog.csdn.net/qq_37636695/article/details/84791468 https://www.jianshu.com/p/aba99a49a459 @P ...