- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我有一个 create-react-app 应用程序工作 100% ,我想集成 webpack4 来部署我的应用程序,但是在配置 webpack 后,当我“npm dev run”时,我在每个惰性导入行上收到这些错误:找不到模块:错误:无法解析“C:....”中的“src/views/UserList”
我的 webpack.config.js :
// webpack.config.js
const path = require( 'path' );
const HtmlWebPackPlugin = require( 'html-webpack-plugin' );
const webpack=require('webpack');
module.exports = {
context: __dirname,
entry: {
bundle: './src/index.js',
},
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'main.js',
},
devServer: {
historyApiFallback: true
},
module: {
rules: [
{
test: /\.(js|jsx)$/,
exclude: /node_modules/,
use: ["babel-loader"],
},
{
test: /\.((c|sa|sc)ss)$/i,
use: ['style-loader', 'css-loader']
},
{
test: /\.(png|j?g|svg|gif)?$/,
use: 'file-loader',
include: path.resolve(__dirname, 'src')
}
]
},
plugins: [
new HtmlWebPackPlugin({
template: path.resolve( __dirname, 'public/index.html' ),
filename: 'index.html'
}),
new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV)
})
],
};
我的routes.js:
/* eslint-disable react/no-multi-comp */
/* eslint-disable react/display-name */
import React, { lazy } from 'react';
import { Redirect } from 'react-router-dom';
import AuthLayout from './layouts/Auth';
import ErrorLayout from './layouts/Error';
import DashboardLayout from './layouts/Dashboard';
import DashboardView from './views/Dashboard';
export default [
{
path: '/',
exact: true,
component: () => <Redirect to="/dashboard" />
},
{
path: '/auth',
component: AuthLayout,
routes: [
{
path: '/auth/login',
exact: true,
component: lazy(() => import('src/views/Login'))
},
{
component: () => <Redirect to="/errors/error-404" />
}
]
},
{
path: '/errors',
component: ErrorLayout,
routes: [
{
path: '/errors/error-403',
exact: true,
component: lazy(() => import('src/views/Error403'))
},
{
path: '/errors/error-404',
exact: true,
component: lazy(() => import('src/views/Error404'))
},
{
path: '/errors/error-500',
exact: true,
component: lazy(() => import('src/views/Error500'))
},
{
component: () => <Redirect to="/errors/error-404" />
}
]
},
{
route: '*',
component: DashboardLayout,
routes: [
{
path: '/dashboard',
exact: true,
component: DashboardView
},
{
path: '/users',
exact: true,
component: lazy(() => import('src/views/UserList'))
},
{
path: '/brands',
exact: true,
component: lazy(() => import('src/views/BrandList'))
},
{
path: '/brands/new',
exact: true,
component: lazy(() => import('src/views/BrandForm/index'))
},
{
path: '/brands/:id',
exact: true,
component: lazy(() => import('src/views/BrandDetails'))
},
{
path: '/users/new',
exact: true,
component: lazy(() => import('src/views/AddUser'))
},
{
path: '/users/:id',
exact: true,
component: lazy(() => import('src/views/UserDetails'))
},
{
path: '/users/:id/:tab',
exact: true,
component: lazy(() => import('src/views/UserDetails'))
},
{
path: '/users/:id/:tab/:itemId',
exact: true,
component: lazy(() => import('src/views/ItemDetails'))
},
{
path: '/service-partners/providers',
exact: true,
component: lazy(() => import('src/views/ProviderList'))
},
{
path: '/service-partners/providers/:id',
exact: true,
component: lazy(() => import('src/views/ProviderDetails'))
},
{
path: '/service-partners/services',
exact: true,
component: lazy(() => import('src/views/ServiceList'))
},
{
path: '/service-partners/services/:id',
exact: true,
component: lazy(() => import('src/views/ServiceDetails'))
},
{
path: '/service-partners/categories',
exact: true,
component: lazy(() => import('src/views/ServiceCategoryList'))
},
{
path: '/feeds',
exact: true,
component: lazy(() => import('src/views/PersonalFeedList'))
},
{
path: '/feeds/:id',
exact: true,
component: lazy(() => import('src/views/PersonalFeedDetails'))
},
{
component: () => <Redirect to="/errors/error-404" />
}
]
}
];
应用程序结构:
public/
index.html
src/
views/
components/
index.js
routes.js
请提供任何解决方案..
最佳答案
默认情况下,如果你没有给它一个相对/绝对路径,webpack只会搜索node_modules
,所以你需要将其添加到你的webpack.config.js
中告诉它也在项目根目录中搜索:
module.exports = {
//...
resolve: {
modules: ['.', 'node_modules']
}
};
更多信息here 。注意这里的顺序很重要,它先在项目根目录中搜索,然后在node_modules中搜索,您可以更改它。
关于reactjs - [ react Webpack] : Module not found: Error: Can't resolve 'src/views/UserList' in 'C:\Users\....' ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62875846/
#include using namespace std; class C{ private: int value; public: C(){ value = 0;
这个问题已经有答案了: What is the difference between char a[] = ?string?; and char *p = ?string?;? (8 个回答) 已关闭
关闭。此题需要details or clarity 。目前不接受答案。 想要改进这个问题吗?通过 editing this post 添加详细信息并澄清问题. 已关闭 7 年前。 此帖子已于 8 个月
除了调试之外,是否有任何针对 c、c++ 或 c# 的测试工具,其工作原理类似于将独立函数复制粘贴到某个文本框,然后在其他文本框中输入参数? 最佳答案 也许您会考虑单元测试。我推荐你谷歌测试和谷歌模拟
我想在第二台显示器中移动一个窗口 (HWND)。问题是我尝试了很多方法,例如将分辨率加倍或输入负值,但它永远无法将窗口放在我的第二台显示器上。 关于如何在 C/C++/c# 中执行此操作的任何线索 最
我正在寻找 C/C++/C## 中不同类型 DES 的现有实现。我的运行平台是Windows XP/Vista/7。 我正在尝试编写一个 C# 程序,它将使用 DES 算法进行加密和解密。我需要一些实
很难说出这里要问什么。这个问题模棱两可、含糊不清、不完整、过于宽泛或夸夸其谈,无法以目前的形式得到合理的回答。如需帮助澄清此问题以便重新打开,visit the help center . 关闭 1
有没有办法强制将另一个 窗口置于顶部? 不是应用程序的窗口,而是另一个已经在系统上运行的窗口。 (Windows, C/C++/C#) 最佳答案 SetWindowPos(that_window_ha
假设您可以在 C/C++ 或 Csharp 之间做出选择,并且您打算在 Windows 和 Linux 服务器上运行同一服务器的多个实例,那么构建套接字服务器应用程序的最明智选择是什么? 最佳答案 如
你们能告诉我它们之间的区别吗? 顺便问一下,有什么叫C++库或C库的吗? 最佳答案 C++ 标准库 和 C 标准库 是 C++ 和 C 标准定义的库,提供给 C++ 和 C 程序使用。那是那些词的共同
下面的测试代码,我将输出信息放在注释中。我使用的是 gcc 4.8.5 和 Centos 7.2。 #include #include class C { public:
很难说出这里问的是什么。这个问题是含糊的、模糊的、不完整的、过于宽泛的或修辞性的,无法以目前的形式得到合理的回答。如需帮助澄清此问题以便重新打开它,visit the help center 。 已关
我的客户将使用名为 annoucement 的结构/类与客户通信。我想我会用 C++ 编写服务器。会有很多不同的类继承annoucement。我的问题是通过网络将这些类发送给客户端 我想也许我应该使用
我在 C# 中有以下函数: public Matrix ConcatDescriptors(IList> descriptors) { int cols = descriptors[0].Co
我有一个项目要编写一个函数来对某些数据执行某些操作。我可以用 C/C++ 编写代码,但我不想与雇主共享该函数的代码。相反,我只想让他有权在他自己的代码中调用该函数。是否可以?我想到了这两种方法 - 在
我使用的是编写糟糕的第 3 方 (C/C++) Api。我从托管代码(C++/CLI)中使用它。有时会出现“访问冲突错误”。这使整个应用程序崩溃。我知道我无法处理这些错误[如果指针访问非法内存位置等,
关闭。这个问题不符合Stack Overflow guidelines .它目前不接受答案。 我们不允许提问寻求书籍、工具、软件库等的推荐。您可以编辑问题,以便用事实和引用来回答。 关闭 7 年前。
已关闭。此问题不符合Stack Overflow guidelines 。目前不接受答案。 要求我们推荐或查找工具、库或最喜欢的场外资源的问题对于 Stack Overflow 来说是偏离主题的,因为
我有一些 C 代码,将使用 P/Invoke 从 C# 调用。我正在尝试为这个 C 函数定义一个 C# 等效项。 SomeData* DoSomething(); struct SomeData {
这个问题已经有答案了: Why are these constructs using pre and post-increment undefined behavior? (14 个回答) 已关闭 6
我是一名优秀的程序员,十分优秀!