2016-09-07 4 views
1

webpack 및 grunt-webpack을 사용하여 반응 파일을 번들로 제공하기 위해 과감한 설정을했습니다.grunt webpack 'webpack-dev-server'모듈을 찾을 수 없습니다.

var webpack = require("webpack"); 
var webpackConfig = require("./webpack.config.js"); 

module.exports = function(grunt) { 
    require('load-grunt-tasks')(grunt); 
    grunt.loadNpmTasks("grunt-webpack"); 

    grunt.initConfig({ 
    eslint: { 
     options: { 
     configFile: 'eslint.json' 
     }, 
     target: ['./react/components/**/*.js','./react/services/**/*.js', './node/source/**/*.js'] 
    }, 
    webpack: { 
     options: webpackConfig, 
     build:{} 
    }, 
    watch: { 
     app: { 
     files: ['./react/main.js', './react/components/**/*.js','./react/services/**/*.js'], 
     tasks: ["webpack"], 
     options: { 
      spawn: false, 
     } 
     } 
    } 
    }); 

    grunt.registerTask('lint', ['eslint']); 
    grunt.registerTask('build', ['webpack']); 
    grunt.registerTask('default', ['watch']); 

}; 

webpack.config.js 파일

const path = require('path'); 
const buildDirectory = './node/static/js/'; 

module.exports = { 
    entry: './react/main.js', 
    resolve: { 
     extensions: ['', '.js', '.jsx'], 
    }, 
    output: { 
     path: path.resolve(buildDirectory), 
     filename: 'bundle.js', 
    }, 
    externals: { 
     'cheerio': 'window', 
     'react/lib/ExecutionEnvironment': true, 
     'react/lib/ReactContext': true, 
    }, 
    stats: { 
     assets: false, 
     colors: false, 
     modules: false, 
     version: false, 
     hash: false, 
     timings: false, 
     chunks: false, 
     chunkModules: false 
    }, 
    module: { 
     loaders: [{ 
      test: /\.jsx?$/, 
      exclude: /(node_modules|bower_components)/, 
      loader: 'babel', 
      query: { 
       presets: ['react', 'es2015'], 
      }, 
     }], 
    }, 
    plugins: [], 
}; 

오류 출력

grunt build 
Loading "webpack-dev-server.js" tasks...ERROR 
>> Error: Cannot find module 'webpack-dev-server' 
Loading "webpack-dev-server.js" tasks...ERROR 
>> Error: Cannot find module 'webpack-dev-server' 

Running "webpack:build" (webpack) task 


Done. 

이를 : 여기에

Cannot find module 'webpack-dev-server' 내 꿀꿀 거리는 소리 파일이기 때문에 나는 webpack-dev-server하지만 여전히 내 툴툴 거리는 소리가 출력되는 오류를 사용하고 있지 않다을 추가하면 오류가 해결됩니다.패키지,하지만 내 프로젝트에 추가 종속성 싶지 않아요.

패키지 :

"webpack": "^1.13.1", 
"grunt-webpack": "^1.0.14", 
"grunt": "^1.0.1", 
"grunt-contrib-watch": "^1.0.0", 
"grunt-eslint": "^19.0.0", 
+0

'웹팩-DEV-server''꿀꿀 - webpack'의 디바이스와 피어 의존성. – robertklep

+0

정말 의존적입니까? 문서에서 원인이 언급 된 곳이 없음 –

+1

예, [여기] (https://github.com/webpack/grunt-webpack/blob/a69fdfdf7988ccbdd83fd1e6123b2cbcce784739/package.json#L21) 및 [여기] (https : // github .com/webpack/grunt-webpack/blob/a69fdfdf7988ccbdd83fd1e6123b2cbcce784739/package.json # L37). 그래도'grunt-webpack'을 설치할 때 설치되었거나 적어도 피어 종속성이 설치되어 있지 않다는 경고를 주어야합니다. – robertklep

답변

2

당신은 종속성으로 추가해야합니다. 어째서 그것을 필요로하지 않는 이유는 무엇입니까? 개발 과정에서 프로젝트를 실행하는 것이 필요해 보인다. 그래서 NPM을 사용하면 개발 의존성을 가질 수 있습니다. 당신이 나열한 것들은 모두 dev에 의존한다.

아래를 참조

"devDependencies": { 
    // ... more dev dependencies 
    "webpack-dev-server": "^1.14.1" 
    }, 
    "dependencies": { 
    // ... more 'normal' dependencies 
    "bootstrap": "^3.3.6" 
    } 
+0

그게 해결책이 아니에요, 그 종류의 해킹. 내가 그것을 사용하지 않는다면 왜 내 프로젝트 안에 그것을 포함시켜야 하는가? –

+1

사용중인 패키지 중 하나를 사용하십시오. 그래서 당신은 그것에 의존해야합니다. 뭔가'''''package.json'''에 모듈을 포함시키는 것은 해킹이 아니기를 요구합니다. –

관련 문제