webpack val loader造成異常

我想在webpack編譯時動態地包含一個.js文件。webpack val loader造成異常

我不想使用上下文來加載環境變量，因爲我的代碼中沒有這些魔術變量。

我想要做的是使用val加載器來執行一個模塊。使用環境變量來決定要導入的模塊。並導出該模塊。

但是，這導致其他裝載機拋出錯誤。

這裏是我的目錄佈局

--base 
    --src 
    app.js 
    test.js 
    webpack.config.js 
    rawr.js

這裏我webpack.config.js文件

var path = require('path'); 
var webpack = require('webpack'); 
// var process = require('process'); 

var env = require(process.env.NODE_ENV || './devConf.js'); 

module.exports = { 
    // Specify logical root of the sourcecode 
    plugins: [ 
     new webpack.DefinePlugin(env) 
    ], 
    context: path.join(__dirname, '/src'), 
    entry: { 
    app: ['bootstrap.js'], 
    }, 

    // Specify where to put the results 
    output: { 
     path: path.join(__dirname, '/dist'), 
     filename: 'build.js' 
    }, 

    // Specify logical root of package imports so as to avoid relative path everywhere 
    resolve: { 
     root: path.join(__dirname, '/src'), 
     // What files we want to be able to import 
     extensions: ['', '.js', '.css', '.less'], 
    }, 

    module: { 
     preLoaders: [ 
      // Lint all js before compiling 
      /*{ 
       test: /\.js$/, 
       exclude: /node_modules/, 
       loader: 'eslint-loader' 
      }*/ 
     ], 
     loaders: [ 
      { 
       test: /\.js$/, 
       query: { 
        presets: ['es2015'] 
       }, 
       exclude: /node_modules/, 
       loader: 'babel' 
      }, 
      { 
       test: /\.tpl\.html$/, 
       exclude: /node_modules/, 
       loader: 'ngtemplate?relativeTo=/src/!html' 
      }, 
     { 
     test: /\.scss$/, 
     loaders: ["style", "css", "sass"] 
     }, 
     { 
     test: /\.css$/, 
     loaders: ["style", "css"] 
     } 
     ] 
    }, 

    // Dev server settings 
    devServer: { 
     contentBase: path.join(__dirname, '/dist'), 
     noInfo: false, 
     hot: true 
    }, 

    // ESLint config 
    eslint: { 
     configFile: path.join(__dirname, '.eslintrc') 
    } 
};

我的js文件看起來像這樣

// app.js 
let b = require('val!test.js'); 

// test.js 
var process = require('process'); 
loadedModule = require(process.env.NODE_ENV) // NODE_ENV='./rawr.js' 
export const myString = loadedModule 

// rawr.js 
module.exports.test = "hello world";

，我發現了異常：

ERROR in ./src/app/app.js 
Module parse failed: /home/smaug/Projects/angular-template/node_modules/babel-loader/index.js?{"presets":["es2015"]}!/home/smaug/Projects/angular-template/src/app/app.js Line 1: Unexpected identifier 
You may need an appropriate loader to handle this file type. 
| 'use strict'; 
| 
| require('angular-animate'); 
@ ./src/bootstrap.js 7:0-18

它與我試圖做的事無關。但是如果我刪除require（'val！...'）聲明，它就會消失。

任何想法？

UPDATE：

如果我改變需要聲明是

let b = require('val!./test.js');

我得到以下錯誤：

ERROR in ./~/val-loader!./src/app/test.js 
Module build failed: Error: Final loader didn't return a Buffer or String 
    at DependenciesBlock.onModuleBuild (/home/smaug/Projects/angular-template/node_modules/webpack-core/lib/NormalModuleMixin.js:299:42) 
    at nextLoader (/home/smaug/Projects/angular-template/node_modules/webpack-core/lib/NormalModuleMixin.js:275:25) 
    at /home/smaug/Projects/angular-template/node_modules/webpack-core/lib/NormalModuleMixin.js:292:15 
    at runSyncOrAsync (/home/smaug/Projects/angular-template/node_modules/webpack-core/lib/NormalModuleMixin.js:160:12) 
    at nextLoader (/home/smaug/Projects/angular-template/node_modules/webpack-core/lib/NormalModuleMixin.js:290:3) 
    at /home/smaug/Projects/angular-template/node_modules/webpack-core/lib/NormalModuleMixin.js:292:15 
    at Object.context.callback (/home/smaug/Projects/angular-template/node_modules/webpack-core/lib/NormalModuleMixin.js:148:14) 
    at Object.module.exports (/home/

來源

2016-02-11 user2734679

// app.js 
let b = require('val!./test.js');

來源

2016-02-11 22:09:51 topheman

我得到一個diff錯誤。 ./~/val-loader!./src/app/test.js中的錯誤模塊構建失敗：錯誤：最終加載程序沒有返回緩衝區或字符串 – user2734679

這次，加載程序工作？該錯誤稍後發生？如果是這樣，請提供以下錯誤。 – topheman

我不知道是否晚點。我會在問題中包含錯誤。 – user2734679

這是一個非常混亂的錯誤信息..

檢查以下事故..

import語句是指向確切的文件;
輸入語句上文件名中的輸入錯誤;導入不存在的模塊。
檢查您是否已經安裝了所有裝載機像

CSS-裝載機節點薩斯決心-URL裝載機薩斯裝載機\ 風格裝載機網址裝載機

4.進口報表爲空

ex：

import * from '';

5.服務和提供程序不返回任何內容也可能導致此錯誤。

來源

2016-12-05 08:46:22

test.js應該返回一個字符串，該字符串包含應該提供給需要它的模塊的代碼。所以，你的榜樣，test.js應該從這個

var process = require('process'); 
loadedModule = require(process.env.NODE_ENV) // NODE_ENV='./rawr.js' 
export const myString = loadedModule

去這個

var process = require('process') 
loadedModule = require('raw-loader!' + process.env.NODE_ENV) 
export const myString = loadedModule

使用「原始加載器」，您將得到rawr.js而不是RAWR值的文本代碼.js出口。然後，「val-loader」會將rawr.js的代碼發送到app.js中的require，它將加載該文本，就好像它是您要加載的文件的文本一樣。

這可能是一個可怕的解釋，但請記住，當您使用val-loader時，您需要返回一個包含代碼的字符串。

來源

2017-01-06 17:39:48

webpack val loader造成異常

回答

相關問題