2016-08-26 26 views
0

webpack用のブートストラップ・ローダーを実装しようとしていますが、私は同じ問題を抱えています。 github repo開発者と一緒にそれを持ってきてみましたが、彼らはそれがうまくいったとは言いませんでしたか?また、問題を解決しなかったアルファ2のブートストラップにダウングレードすることを推奨しました。webpackはブートストラップ・モジュールをブートストラップ・ローダー用に解決できません

repo for reference

エラー

ERROR in ./~/bootstrap-loader/lib/bootstrap.loader.js?configFilePath=/home/p3pt/dev/java/projects/sba2-wip/frontend/config/.bootstraprc!./~/bootstrap-loader/no-op.js 
Module build failed: Error: 
Could not find bootstrap version: '4'. Did you install it? 
The package is 'bootstrap' for bootstrap v4 and 'bootstrap-sass' for v3. 

    at Object.module.exports.pitch (/home/p3pt/dev/java/projects/sba2-wip/frontend/node_modules/bootstrap-loader/lib/bootstrap.loader.js:114:11) 

デバッグログ

[bootstrap-loader]: bootstrap-loader is using config file at /home/p3pt/dev/java/projects/sba2-wip/frontend/config/.bootstraprc 

[bootstrap-loader]: Hey, we're in DEBUG mode because you have 
     your config log level set to 'debug'. 

[bootstrap-loader]: Query from webpack config: ?configFilePath=/home/p3pt/dev/java/projects/sba2-wip/frontend/config/.bootstraprc 

[bootstrap-loader]: Using Bootstrap module: bootstrap 

[bootstrap-loader]: resolveModule error is [Error: Cannot find module 'bootstrap' from '/home/p3pt/dev/java/projects/sba2-wip/frontend/node_modules/bootstrap-loader/lib/utils'] 

[bootstrap-loader]: Bootstrap module location (abs): false 

WebPACKの設定

const webpackMerge = require('webpack-merge'); 
const ExtractTextPlugin = require('extract-text-webpack-plugin'); 
const DefinePlugin = require('webpack/lib/DefinePlugin'); 
const commonConfig = require('./webpack.common.js'); 
const helpers = require('./helpers'); 

const ENV = process.env.ENV = process.env.NODE_ENV = 'development'; 
const HMR = helpers.hasProcessFlag('hot'); 
const METADATA = webpackMerge(commonConfig.metadata, { 
    host: 'localhost', 
    port: 3000, 
    ENV: ENV, 
    HMR: HMR 
}); 

const bootstrapDevEntryPoint = 'bootstrap-loader/lib/bootstrap.loader?' + 
      `configFilePath=${__dirname}/.bootstraprc` + 
      '!bootstrap-loader/no-op.js'; 

module.exports = webpackMerge(commonConfig, { 
    metadata: METADATA, 
    debug: true, 
    devtool: 'cheap-module-eval-source-map', 

    entry: { 
     bootstrapDevEntryPoint 
    }, 

    output: { 
     path: helpers.root('dist'), 
     filename: '[name].js', 
     chunkFilename: '[id].chunk.js', 
     sourceMapFilename: '[name].map', 
     library: 'ac_[name]', 
     libraryTarget: 'var', 
    }, 

    plugins: [ 
     new DefinePlugin({ 
      'ENV': JSON.stringify(METADATA.ENV), 
      'HMR': METADATA.HMR, 
      'process.env': { 
       'ENV': JSON.stringify(METADATA.ENV), 
       'NODE_ENV': JSON.stringify(METADATA.ENV), 
       'HMR': METADATA.HMR 
      } 
     }), 
    ], 

    devServer: { 
     port: METADATA.port, 
     host: METADATA.host, 
     historyApiFallback: true, 
     watchOptions: { 
      aggregateTimeout: 300, 
      poll: 1000 
     }, 
     outputPath: helpers.root('dist') 
    }, 

    node: { 
     global: 'window', 
     crypto: 'empty', 
     process: true, 
     module: false, 
     clearImmediate: false, 
     setImmediate: false 
    } 
}); 

package.json

... 
    "dependencies": { 
    "@angular/common": "2.0.0-rc.5", 
    "@angular/compiler": "2.0.0-rc.5", 
    "@angular/core": "2.0.0-rc.5", 
    "@angular/forms": "0.3.0", 
    "@angular/http": "2.0.0-rc.5", 
    "@angular/platform-browser": "2.0.0-rc.5", 
    "@angular/platform-browser-dynamic": "2.0.0-rc.5", 
    "@angular/platform-server": "2.0.0-rc.5", 
    "@angular/router": "3.0.0-rc.1", 
    "bootstrap": "^4.0.0-alpha.2", 
    "core-js": "^2.4.1", 
    "font-awesome": "^4.6.3", 
    "jquery": "^3.1.0", 
    "lodash": "^4.15.0", 
    "moment": "^2.14.1", 
    "ng2-bootstrap": "^1.0.24", 
    "rxjs": "5.0.0-beta.11", 
    "tether": "^1.3.4", 
    "zone.js": "^0.6.17" 
    }, 
    "devDependencies": { 
    "@types/jasmine": "^2.2.33", 
    "@types/lodash": "4.14.34", 
    "@types/node": "^6.0.38", 
    "@types/source-map": "^0.1.26", 
    "@types/webpack": "^1.12.33", 
    "angular2-hmr": "~0.8.1", 
    "angular2-template-loader": "^0.5.0", 
    "autoprefixer": "^6.4.0", 
    "awesome-typescript-loader": "2.2.1", 
    "bootstrap-loader": "^2.0.0-beta.3", 
    "codelyzer": "0.0.28", 
    "css-loader": "^0.24.0", 
    "extract-text-webpack-plugin": "^2.0.0-beta.3", 
    "file-loader": "^0.9.0", 
    "font-awesome-sass-loader": "^1.0.2", 
    "html-loader": "^0.4.3", 
    "html-webpack-plugin": "^2.22.0", 
    "http-server": "^0.9.0", 
    "imports-loader": "^0.6.5", 
    "istanbul-instrumenter-loader": "^0.2.0", 
    "jasmine-core": "^2.4.1", 
    "json-loader": "^0.5.4", 
    "karma": "^1.2.0", 
    "karma-chrome-launcher": "^2.0.0", 
    "karma-coverage": "^1.1.1", 
    "karma-jasmine": "^1.0.2", 
    "karma-mocha-reporter": "^2.1.0", 
    "karma-sourcemap-loader": "^0.3.7", 
    "karma-webpack": "^1.8.0", 
    "node-sass": "^3.8.0", 
    "postcss-loader": "^0.10.1", 
    "raw-loader": "^0.5.1", 
    "remap-istanbul": "^0.6.4", 
    "resolve": "^1.1.7", 
    "resolve-url-loader": "^1.6.0", 
    "rimraf": "^2.5.4", 
    "sass-loader": "^4.0.0", 
    "source-map-loader": "^0.1.5", 
    "style-loader": "^0.13.1", 
    "to-string-loader": "^1.1.4", 
    "ts-helpers": "1.1.1", 
    "ts-node": "^1.3.0", 
    "tslint": "^3.15.1", 
    "tslint-loader": "^2.1.5", 
    "typescript": "^2.0.0-beta", 
    "url-loader": "^0.5.7", 
    "webpack": "^2.1.0-beta.21", 
    "webpack-dev-server": "^2.1.0-beta.0", 
    "webpack-merge": "^0.14.1" 
    } 
... 
+0

に次のように変更することで、私は先に行くとobviを頼むよ公転しous:実際に 'bootstrap'パッケージをインストールしましたか? – robertklep

+0

はい、私はpackage.json – oxenfree

答えて

1

は問題がブートストラップアルファ3が破壊されることで、アルファ2にダウングレードするための推奨は、実際に作業を行います。私は、npmのインストールが^シンボルでピックアップしてパッケージをアップグレードすると誤解しました。

修正がpackage.json

変更

"bootstrap": "^4.0.0-alpha.2"

"bootstrap": "4.0.0-alpha.2"

+0

を掲示します。あなたの人生はこのおかげでここに保存されます! – Necronet

+0

@Necronetこれは他人を助けてくれてうれしいです! – oxenfree

関連する問題