webpack入门配置问题?

初学webpack,参照资料配置一直报错,麻烦给指点一下!!!
错误提示:ERROR in multi main
Module not found: Error: Cannot resolve 'file' or 'directory' ./public/pages/index.js in D:websitewebpack\
我配置的代码config文件如下:

// config/webpack.config.js
const webpack = require('webpack');

// 配置目录
// 因为我们的webpack.config.js文件不在项目根目录下,所以需要一个路径的配置
const path = require('path');
const CURRENT_PATH = path.resolve(__dirname); // 获取到当前目录
const ROOT_PATH = path.join(__dirname, '../'); // 项目根目录
const MODULES_PATH = path.join(ROOT_PATH, './node_modules'); // node包目录
const BUILD_PATH = path.join(ROOT_PATH, './public/assets'); // 最后输出放置公共资源的目录
const ExtractTextPlugin = require("extract-text-webpack-plugin");
module.exports = {
    context: path.join(__dirname, '../'), // 设置webpack配置中指向的默认目录为项目根目录
    entry: {
        index: './public/pages/index.js',
        public: './public/pages/public.js'
    },
    output: {
        path: BUILD_PATH, // 设置输出目录
        filename: '[name].bundle.js', // 输出文件名
    },
    resolve: {
        extensions: ['', '.js', '.jsx', '.coffee'] // 配置简写,配置过后,书写该文件路径的时候可以省略文件后缀
    },
    module: {
        loaders: [
            // style & css & less loader
            { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader')},
            { test: /\.less$/, loader: ExtractTextPlugin.extract('style', 'css!less') },
            // babel loader
            {
                test: /\.jsx?$/,
                exclude: /(node_modules|bower_components)/,
                loader: ['babel-loader'],
                query: {
                  presets: ['es2015']
                  // 如果安装了React的话
                  // presets: ['react', 'es2015']
                }
            },
            // image & font
            { test: /\.(woff|woff2|eot|ttf|otf)$/i, loader: 'url-loader?limit=8192&name=[name].[ext]'},
            { test: /\.(jpe?g|png|gif|svg)$/i, loader: 'url-loader?limit=8192&name=[name].[ext]'},
            // expose-loader将需要的变量从依赖包中暴露出来
            { test: require.resolve("jquery"), loader: "expose?$! expose?jQuery" },
            {
                test: /\.jsx?$/,
                exclude: /(node_modules|bower_components)/,
                loader: ['babel-loader'],
                query: {
                    presets: ['react', 'es2015']
                }
            }
        ]
    },
    plugins: [
        // 分离css
        new ExtractTextPlugin('[name].bundle.css', {
            allChunks: true
        }),
        // public sources
        new webpack.optimize.CommonsChunkPlugin({
            // 与 entry 中的 jquery 对应
            name: 'jquery',
            // 输出的公共资源名称
            filename: 'common.bundle.js',
            // 对所有entry实行这个规则
            minChunks: Infinity
        }),
        new webpack.optimize.UglifyJsPlugin({
            mangle: {
              except: ['$super', '$', 'exports', 'require']
              //以上变量‘$super’, ‘$’, ‘exports’ or ‘require’,不会被混淆
            },
            compress: {
              warnings: false
            }
        }),
        new webpack.DefinePlugin({
            "process.env": { 
                NODE_ENV: JSON.stringify("production") 
            }
        })
    ]
}
阅读 5.4k
1 个回答

报错信息提示你

Module not found: Error: Cannot resolve 'file' or 'directory' ./public/pages/index.js in D:websitewebpack\

所以检查一下,在websitewebpack是否存在public/pages/index.js.

按下面这个目录层级查找

- websitewebpack
  - public
    - pages
       index.js
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
1 篇内容引用
推荐问题