2017-07-22 210 views
0

我使用Sails 1与webpack,当我试图从我的主要js文件导入jquery时,我得到这个错误大声说,它不能解决jQuery的。webpack - 模块未找到:错误:无法解析'jquery'

webpack.config.js:

var path = require('path'); 
var webpack = require('webpack'); 
var ExtractTextPlugin = require('extract-text-webpack-plugin'); 
var CleanWebpackPlugin = require('clean-webpack-plugin'); 
var CopyWebpackPlugin = require('copy-webpack-plugin'); 

module.exports.webpack = { 

    devtool: 'source-map', 
    entry: { 
     'admin': './assets/admin/js/admin.js' 
    }, 
    output: { 
     filename: 'js/[name].bundle.js', 
     path: path.resolve(__dirname, '..', '.tmp', 'public') 
    }, 
    resolve: { 
     modules: [ 
      path.join(__dirname, "js"), "node_modules" 
     ] 
    }, 
    module: { 
     // Extract less files 
     rules: [{ 
      test: /\.css$/, 
      loader: ExtractTextPlugin.extract({ use: 'css-loader' }) 
     }, { 
      test: /\.less$/, 
      loader: ExtractTextPlugin.extract({ use: 'css-loader!less-loader' }) 
     }, { 
      test: /\.js$/, 
      exclude: /node_modules/, 
      loader: 'babel-loader', 
      options: { 
       presets: [ 
        [ 'es2015', { modules: false } ] 
       ] 
      } 
     }] 
    }, 
    plugins: [ 

     new webpack.ProvidePlugin({ 
      $: 'jquery', 
      jQuery: 'jquery' 
     }), 
     // This plugin extracts CSS that was imported into .js files, and bundles 
     // it into separate .css files. The filename is based on the name of the 
     // .js file that the CSS was imported into. 
     new ExtractTextPlugin('css/[name].bundle.css'), 

     // This plugin cleans out your .tmp/public folder before lifting. 
     new CleanWebpackPlugin(['public'], { 
      root: path.resolve(__dirname, '..', '.tmp'), 
      verbose: true, 
      dry: false 
     }), 

     // This plugin copies the `images` and `fonts` folders into 
     // the .tmp/public folder. You can add any other static asset 
     // folders to this list and they'll be copied as well. 
     new CopyWebpackPlugin([{ 
      from: './assets/images', 
      to: path.resolve(__dirname, '..', '.tmp', 'public', 'images') 
     }]) 
    ] 
}; 

,并在我的资产/管理/ JS/admin.js我只有

import 'jquery'; 

jQuery是我的包JSON和它显示在名为jquery的node_modules包下。

另一个奇怪的是,如果我改变jQuery和尝试导入,它完美的作品,所以我不认为这是一个node_modules目录问题,或者类似的东西。

+0

这有帮助吗? https://stackoverflow.com/questions/43198547/webpack-module-not-found-error-cant-resolve-jquery –

+0

@jimcollins我看到了答案,但由于角度工作正常,并通过npm安装就像jquery ,它似乎可能是不同的东西,我错过了什么? –

+1

配置看起来不错,我不认为它是与webpack相关的。也许模块没有正确安装。你可以运行'node -e'require(“jquery”)?如果抛出一个错误,你应该删除'node_modules'并重新安装它们。 –

回答

0

一个不同的问题给我带来了这里。对于来自Google的未来访问者,请尝试运行:

webpack --display-error-details 
相关问题