2017-12-11 2 views
0

aspnet 핵심 템플릿을 사용하여 생성 한 angular2 + 프로젝트가 있습니다. 나는 asp net core에서 제공하는 템플릿을 사용하여 프로젝트를 시작했다. 패키지를 Angular 5.1 이후로 업데이트했습니다. 나는 최근에 내가 웹팩 --config webpack.config.vendor.js는 vendor.css을 생성 나던 실행할 때 새로운 노트북은 내가 그러나 새 컴퓨터에 복제를했다 가지고 있으며이 오류가 발생합니다 : enter image description hereWebpack은 dist/vendor.css를 생성/재 생성하지 않습니다.

을 이것은 내가 거의 변경하는 내 webpack.config.vendor.js입니다 :

const path = require('path'); 
const webpack = require('webpack'); 
const ExtractTextPlugin = require('extract-text-webpack-plugin'); 
const merge = require('webpack-merge'); 

module.exports = (env) => { 
    const extractCSS = new ExtractTextPlugin('vendor.css'); 
    const isDevBuild = !(env && env.prod); 
    const sharedConfig = { 
     stats: { modules: false }, 
     resolve: { extensions: [ '.js' ] }, 
     module: { 
      rules: [ 
       { test: /\.(png|woff|woff2|eot|ttf|svg)(\?|$)/, use: 'url-loader?limit=100000' } 
      ] 
     }, 
     entry: { 
      vendor: [ 
       '@angular/animations', 
       '@angular/common', 
       '@angular/compiler', 
       '@angular/core', 
       '@angular/forms', 
       '@angular/http', 
       '@angular/platform-browser', 
       '@angular/platform-browser-dynamic', 
       '@angular/router', 
       'bootstrap', 
       'es6-shim', 
       'es6-promise', 
       'event-source-polyfill', 
       'jquery', 
       'zone.js' 
      ] 
     }, 
     output: { 
      publicPath: '/dist/', 
      filename: '[name].js', 
      library: '[name]_[hash]' 
     }, 
     plugins: [ 
      new webpack.ProvidePlugin({ 
       $: 'jquery', 
       jQuery: 'jquery', 
       jquery: 'jquery' 
      }), // Maps these identifiers to the jQuery package (because Bootstrap expects it to be a global variable) 
      new webpack.ContextReplacementPlugin(/\@angular\b.*\b(bundles|linker)/, path.join(__dirname, './ClientApp')), // Workaround for https://github.com/angular/angular/issues/11580 
      new webpack.ContextReplacementPlugin(/angular(\\|\/)core(\\|\/)@angular/, path.join(__dirname, './ClientApp')), // Workaround for https://github.com/angular/angular/issues/14898 
      new webpack.IgnorePlugin(/^vertx$/) // Workaround for https://github.com/stefanpenner/es6-promise/issues/100 
     ] 
    }; 

    const clientBundleConfig = merge(sharedConfig, { 
     output: { path: path.join(__dirname, 'wwwroot', 'dist') }, 
     module: { 
      rules: [ 
       { test: /\.css(\?|$)/, use: extractCSS.extract({ use: isDevBuild ? 'css-loader' : 'css-loader?minimize' }) } 
      ] 
     }, 
     plugins: [ 
      extractCSS, 
      new webpack.DllPlugin({ 
       path: path.join(__dirname, 'wwwroot', 'dist', '[name]-manifest.json'), 
       name: '[name]_[hash]' 
      }) 
     ].concat(isDevBuild ? [] : [ 
      new webpack.optimize.UglifyJsPlugin() 
     ]) 
    }); 

    const serverBundleConfig = merge(sharedConfig, { 
     target: 'node', 
     resolve: { mainFields: ['main'] }, 
     output: { 
      path: path.join(__dirname, 'ClientApp', 'dist'), 
      libraryTarget: 'commonjs2', 
     }, 
     module: { 
      rules: [ { test: /\.css(\?|$)/, use: ['to-string-loader', isDevBuild ? 'css-loader' : 'css-loader?minimize' ] } ] 
     }, 
     entry: { vendor: ['aspnet-prerendering'] }, 
     plugins: [ 
      new webpack.DllPlugin({ 
       path: path.join(__dirname, 'ClientApp', 'dist', '[name]-manifest.json'), 
       name: '[name]_[hash]' 
      }) 
     ] 
    }); 

    return [clientBundleConfig, serverBundleConfig]; 
} 

나는 vendor.css가 않습니다 내 이전 컴퓨터에있는 프로젝트.

감사합니다.

답변

0

구성이 양호합니다. 공급 업체 모듈이 업그레이드되어 더 이상 require css가되지 않습니까? 사물의

커플

  1. 에 대한 것은 새로운 노트북 동일한 버전의 오래된 기계의과 공급 업체 모듈의를 가지고 있는지 확인합니다 확인합니다.
  2. 응용 프로그램 측면에서 vendor.css에 대한 참조를 제거하고 UI에 의 문제가 있는지 확인하십시오.
+0

안녕하세요 덕분에

new webpack.ContextReplacementPlugin(/\@angular(\\|\/)core(\\|\/)esm5/, path.join(__dirname, './src')), 

을하지만, 그것은 webpack.vendor 쓸모 없게/깨진 것 같다 (나는 깊이 모르겠다. 잘 모르겠다.) 내가 angular4.2에서 5.0으로 업데이트했을 때 ... 아래 수정을 보라. – user3327729

0
Angular4.x에서 업데이트 할 때 난 그냥이 추가했다 5.x를 위해 비슷한 문제를 가지고 사람에게

: 대한 답변을 플러그인에

관련 문제