2017-06-01 18 views
0

こんにちは、vueとwebpackで新しいプロジェクトを作成しましたが、.htmlではなく.hueとしてテンプレートをロードします。私はエラーを得た「あなたは、このファイルタイプを処理するために、適切なローダーが必要な場合があります」とwebpack.base.conf.jsに私はWebPACKのコンフィグで.vueのwebpack変更拡張

var path = require('path') 
 
var utils = require('./utils') 
 
var config = require('../config') 
 
var vueLoaderConfig = require('./vue-loader.conf') 
 

 
function resolve(dir) { 
 
    return path.join(__dirname, '..', dir) 
 
} 
 

 
module.exports = { 
 
    entry: { 
 
     app: './src/main.js' 
 
    }, 
 
    output: { 
 
     path: config.build.assetsRoot, 
 
     filename: '[name].js', 
 
     publicPath: process.env.NODE_ENV === 'production' ? 
 
      config.build.assetsPublicPath : config.dev.assetsPublicPath 
 
    }, 
 
    resolve: { 
 
     extensions: ['.js', '.html', '.json'], 
 
     alias: { 
 
      'html$': 'vue/dist/vue.esm.js', 
 
      '@': resolve('src') 
 
     } 
 
    }, 
 
    module: { 
 
     rules: [ 
 
      { 
 
       test: /\.html$/, 
 
       loader: 'vue-loader', 
 
       options: vueLoaderConfig 
 
     }, 
 
      { 
 
       test: /\.js$/, 
 
       loader: 'babel-loader', 
 
       include: [resolve('src'), resolve('test')] 
 
     }, 
 
      { 
 
       test: /\.(png|jpe?g|gif|svg)(\?.*)?$/, 
 
       loader: 'url-loader', 
 
       options: { 
 
        limit: 10000, 
 
        name: utils.assetsPath('img/[name].[hash:7].[ext]') 
 
       } 
 
     }, 
 
      { 
 
       test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/, 
 
       loader: 'url-loader', 
 
       options: { 
 
        limit: 10000, 
 
        name: utils.assetsPath('fonts/[name].[hash:7].[ext]') 
 
       } 
 
     } 
 
    ] 
 
    } 
 
}

+0

あなたがしようとしていることを私は確信していません。 .vueファイルではなく.htmlファイルにラップされたテンプレートを読み込んで、Vueコンポーネントに配置しようとしていますか?はいの場合、それは非常に良いアイデアのようには見えません。 mixinsテンプレートのみの.vueコンポーネントとして拡張/使用するのはなぜですか? – Cobaltway

答えて

1
npm install -s html-loader 

、その後を持っています、これを他のルールに追加してください:

{ 
    test: /\.html$/, 
    use: 'html-loader', 
}, 
関連する問題