Webpack और टाइपप्रति: मॉड्यूल node.d.ts

Question

में 'child_process' को हल नहीं कर सकते मैं webpack, टाइपप्रति और react.js awesome-typescript-loader के माध्यम से एक साथ काम कर पाने की कोशिश की, लेकिन मैं लगातार त्रुटियों मिलता है।

मैं संस्करण 0.3.0-rc.2 और webpack पर भयानक टाइपप्रति लोडर उपयोग कर रहा हूँ 1.8.9

यह मेरा webpack.config.js है:

module.exports = { 
    entry: './ui/index.ts', 
    output: { 
     path: __dirname + '/build-ui', 
     filename: 'app.js', 
     publicPath: 'http://localhost:8090/assets' 
    }, 
    module: { 
     loaders: [ 
      { 
       test: /\.jsx$/, 
       loader: 'jsx-loader?insertPragma=React.DOM&harmony' 
      }, 
      { 
       test: /\.css$/, 
       loader: "style-loader!css-loader" 
      }, 
      { 
       test: /\.scss$/, 
       loader: "style-loader!css-loader!sass-loader" 
      }, 
      { 
       test: /\.(png|jpg)$/, 
       loader: 'url-loader?limit=8192' 
      }, 
      { 
       test: /\.ts$/, 
       loader: 'awesome-typescript-loader' 
      } 
     ] 
    }, 
    resolve: { 
     extensions: ['', '.js', '.jsx', '.ts'] 
    } 
}; 

जब मैं चलाने webpack देव सर्वर और मेरे index.ts इस तरह दिखता है:

:

alert('hello'); 

यह निम्न त्रुटि कहा गया है 10

वही जब मैं संदर्भ पथ में डालता हूं।

जब मैं import React = require('react'); के माध्यम से React.js आयात करने का प्रयास यह कहता है:

ERROR in ./ui/index.ts 
Module build failed: Cannot resolve module 'child_process' in /..../typings/node 
    Required in /..../typings/node/node.d.ts 

मैं लोडर रेपो से node.d.ts फ़ाइल, फिर भी प्रयास विफल कॉपी किया गया।

किसी को भी इस संयोजन काम सुचारू रूप से प्राप्त करने में सक्षम हो गया है? या मुझे बस एक अलग वेब पैकेजर का उपयोग करना चाहिए? मैं वास्तव में इसे वेबपैक के साथ काम करना चाहता हूं।

Answer 1

सभी से वंचित हो रहे एक प्रमुख target: 'node' है।

यह सुनिश्चित करें कि वातावरण आप को लक्षित कर रहे Node.js और नहीं ब्राउज़र है, और इसलिए देशी निर्भरता पर ध्यान नहीं देगा बनाता है।

अंतिम कॉन्फ़िग:

module.exports = { 
 
    entry: './ui/index.ts', 
 
    target: 'node', 
 
    output: { 
 
     path: __dirname + '/build-ui', 
 
     filename: 'app.js', 
 
     publicPath: 'http://localhost:8090/assets' 
 
    }, 
 
    module: { 
 
     loaders: [ 
 
      { 
 
       test: /\.jsx$/, 
 
       loader: 'jsx-loader?insertPragma=React.DOM&harmony' 
 
      }, 
 
      { 
 
       test: /\.css$/, 
 
       loader: "style-loader!css-loader" 
 
      }, 
 
      { 
 
       test: /\.scss$/, 
 
       loader: "style-loader!css-loader!sass-loader" 
 
      }, 
 
      { 
 
       test: /\.(png|jpg)$/, 
 
       loader: 'url-loader?limit=8192' 
 
      }, 
 
      { 
 
       test: /\.ts$/, 
 
       loader: 'awesome-typescript-loader' 
 
      } 
 
     ] 
 
    }, 
 
    resolve: { 
 
     extensions: ['', '.js', '.jsx', '.ts'] 
 
    } 
 
};

Answer 2

आप एक अलग webpack TypeScript loader उपयोग करने पर विचार कर सकता है। मुझे पता है कि कुछ नोड सामान के साथ मुद्दों थे। कुछ starterkits भी हैं जो मदद कर सकते हैं।

अस्वीकरण: मैं ts-loader के मेंटेनर हूँ।

Answer 3

एक tsconfig.json फ़ाइल बनाने का प्रयास करें।

उदाहरण के लिए

, जैसा कि आप awesome-typescript-loader उपयोग कर रहे हैं यह काम करना चाहिए:

{ 
    "compilerOptions": { 
    "target": "es5", 
    "module": "commonjs", 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "sourceMap": true, 
    "noEmitHelpers": true 
    }, 
    "exclude": [ 
    "node_modules" 
    ], 
    "awesomeTypescriptLoaderOptions": { 
    "forkChecker": true 
    }, 
    "compileOnSave": false, 
    "buildOnSave": false, 
    "atom": { "rewriteTsconfig": false } 
}