錄入模塊：無法解析」 ./assets/app.js'

Question

我想使用的WebPack但我得到一個錯誤

$ node_modules/.bin/webpack 
Hash: d1aee5dc037997fae5a6 
Version: webpack 3.4.1 
Time: 31ms 

ERROR in Entry module not found: Error: Can't resolve './assets/app.js' in 'D:\template\src' 

這是使用的WebPack我的第一次。

這裏是我的腳本

const path = require('path'); 
const webpack = require('webpack'); 
module.exports = { 
    context: path.resolve(__dirname, './src'), 
    entry: { 
    app: './assets/app.js', 
    }, 
    output: { 
    path: path.resolve(__dirname, './node_modules'), 
    filename: '[name].bundle.js', 
    }, 
}; 

我的文件夾結構

我覺得我得到的錯誤這裏 context: path.resolve(__dirname, './src'),我只是不與我替換部分知道。

我已經看過這個https://webpack.github.io/docs/tutorials/getting-started，並且已經嘗試有關如何使用的WebPack與谷歌搜索。任何解決方案？

"devDependencies": { 
    "buefy": "", 
    "bulma": "", 
    "vue": "^2.1.10", 
    "webpack": "^3.4.1" 
    }, 

Answer 1

context選項定義了用於解析webpack配置中的任何內容的基本目錄。您正在使用./src/作爲基本目錄，所以./assets/app.js是src目錄內解決（這在技術上是./src/assets/app.js）。

如果沒有提供context，的WebPack將使用當前目錄，這是你想要的。您可以從您的配置中完全刪除context。您可能還想將該軟件包輸出到目錄中，例如./dist而不是./node_modules。你的配置如下。

const path = require('path'); 
const webpack = require('webpack'); 

module.exports = { 
    entry: { 
    app: './assets/app.js', 
    }, 
    output: { 
    path: path.resolve(__dirname, './dist'), 
    filename: '[name].bundle.js', 
    }, 
}; 

您正在尋找在的WebPack 1個文檔，但你應該使用較新的文檔，其中有顯著更好：Webpack - Getting Started。