与路径有关的Webpack问题

时间:2018-12-21 13:56:12

标签: javascript reactjs

    const HtmlWebPackPlugin = require("html-webpack-plugin");

const htmlWebpackPlugin = new HtmlWebPackPlugin({
template: "./src/index.html",
filename: "./index.html"
});

module.exports = {
entry: './src/index.js',
module: {
    rules: [
        {test: /\.js$/,exclude: /node_modules/,
            use: {loader: "babel-loader"}
        },
        {
            test: /\.(png|jpg|jpeg|gif)$/,
            use: [{loader: 'file-loader',options: {}}]
        },
        {test: /\.(ttf|eot|woff|woff2|svg)(\?[\s\S]+)?$/,use: 'file-loader',},
        {test: /\.csv$/,
            loader: 'csv-loader',
            options: {
                dynamicTyping: true,
                header: true,
                skipEmptyLines: true
            }
        },
        {
            test: /\.css$/,
            use: ['style-loader', 'css-loader']
        },
        {
            test: /\.(pdf|gif|png|jpe?g|svg)$/,
            use: 'file-loader?name=[path][name].[ext]'
        },
        {
            test: /\.(csv|doc|docx)$/,
            loader: 'csv-loader',
            options: {dynamicTyping: true,header: true,skipEmptyLines: true}
        },
        { test: /\.xlsx$/, loader: "webpack-xlsx-loader" },
        {test: /\.(mp3|avi|mov)$/, loader: 'file-loader'},
        { test: /\.(webm|mp4)$/,loader: 'file-loader'},
        { test: /\.(rtf|wexbim)$/,loader: 'raw-loader'}
    ]
},
plugins: [
    htmlWebpackPlugin
],
devServer: {
    contentBase: './dist',
    hot: true,
    historyApiFallback: true,
    host:'192.168.1.166',
    // host:'127.0.0.1',
    port:'8080'
},
devtool: 'inline-source-map'

};

我正在使用webpack 4并出现以下错误:

"client:168 ./src/components/Fileviewer/drivers/index.js
Module not found: Error: Can't resolve './audio-viewer' in '/Users/arush.singh/Desktop/arush_desktop_12-Nov-18/react-webpack4/src/components/Fileviewer/drivers'"

路径问题,当我忽略的文件较少时,但是现在它变得非常频繁,我尝试了所有资源,请检查是否做错了什么事情

package.json{
 "webpack": "^4.26.0",
 "webpack-cli": "^3.1.1",
 "webpack-dev-server": "^3.1.10",
 "webpack-xlsx-loader": "^1.0.0"
}

这是src / components / drivers / index.js中的代码,如果我愿意的话,我可以为您提供更多详细信息

        src/components/Fileviewer/drivers
export { default as CsvViewer } from './csv-viewer';
export { default as Photo360Viewer } from './photo360-viewer';
export { default as PDFViewer } from './pdf-viewer';
export { default as DocxViewer } from './docx-viewer';
export { default as VideoViewer } from './video-viewer';
export { default as XlsxViewer } from './xlsx-viewer';
export { default as XBimViewer } from './xbim-viewer';
export { default as UnsupportedViewer } from './unsupported-viewer';
export { default as PhotoViewer } from './photo-viewer';
export { default as PhotoViewerWrapper } from './photo-viewer- 
 wrapper';
export { default as AudioViewer } from './audio-viewer';

1 个答案:

答案 0 :(得分:2)

对我来说,这似乎不是Webpack的问题? 您能从index.js发布src/components/Fileviewer/drivers的代码吗?我认为问题很可能在那里,因为那是错误的源头。