2016-11-30 78 views
0

這是從Vue Webpack template原代碼:如何在以下情況下使用babel-polyfill?

entry: { 
    app: './src/main.js' 
}, 

這是我在網上找到了一個例子:

entry: [ 
    'babel-polyfill', 
    './src/main.js' 
], 

不過,我得到這個錯誤:

E:\alex\vue2-project-example\node_modules\webpack\lib\NormalModuleFactory.js:72 
         var elements = request.replace(/^-?!+/, "").replace(/!!+/g, "!").split("!"); 

編輯:這是整個文件(同樣是Vue Webpack官方模板庫):

var path = require('path') 
var config = require('../config') 
var utils = require('./utils') 
var projectRoot = path.resolve(__dirname, '../') 

var env = process.env.NODE_ENV 
// check env & config/index.js to decide weither to enable CSS Sourcemaps for the 
// various preprocessor loaders added to vue-loader at the end of this file 
var cssSourceMapDev = (env === 'development' && config.dev.cssSourceMap) 
var cssSourceMapProd = (env === 'production' && config.build.productionSourceMap) 
var useCssSourceMap = cssSourceMapDev || cssSourceMapProd 

module.exports = { 
    entry: [ 
    'babel-polyfill', 
    app: './src/main.js' 
    ], 
    // entry: { 
    // app: './src/main.js' 
    // }, 
    output: { 
    path: config.build.assetsRoot, 
    publicPath: process.env.NODE_ENV === 'production' ? config.build.assetsPublicPath : config.dev.assetsPublicPath, 
    filename: '[name].js' 
    }, 
    resolve: { 
    extensions: ['', '.js', '.vue'], 
    fallback: [path.join(__dirname, '../node_modules')], 
    alias: { 
     'vue$': 'vue/dist/vue', 
     'src': path.resolve(__dirname, '../src'), 
     'assets': path.resolve(__dirname, '../src/assets'), 
     'components': path.resolve(__dirname, '../src/components') 
    } 
    }, 
    resolveLoader: { 
    fallback: [path.join(__dirname, '../node_modules')] 
    }, 
    module: { 
    preLoaders: [ 
     { 
     test: /\.vue$/, 
     loader: 'eslint', 
     include: projectRoot, 
     exclude: /node_modules/ 
     }, 
     { 
     test: /\.js$/, 
     loader: 'eslint', 
     include: projectRoot, 
     exclude: /node_modules/ 
     } 
    ], 
    loaders: [ 
     { 
     test: /\.vue$/, 
     loader: 'vue' 
     }, 
     { 
     test: /\.js$/, 
     loader: 'babel', 
     include: projectRoot, 
     exclude: /node_modules/ 
     }, 
     { 
     test: /\.json$/, 
     loader: 'json' 
     }, 
     { 
     test: /\.(png|jpe?g|gif|svg)(\?.*)?$/, 
     loader: 'url', 
     query: { 
      limit: 10000, 
      name: utils.assetsPath('img/[name].[hash:7].[ext]') 
     } 
     }, 
     { 
     test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/, 
     loader: 'url', 
     query: { 
      limit: 10000, 
      name: utils.assetsPath('fonts/[name].[hash:7].[ext]') 
     } 
     } 
    ] 
    }, 
    eslint: { 
    formatter: require('eslint-friendly-formatter') 
    }, 
    vue: { 
    loaders: utils.cssLoaders({ sourceMap: useCssSourceMap }), 
    postcss: [ 
     require('autoprefixer')({ 
     browsers: ['last 2 versions'] 
     }) 
    ] 
    } 
} 
+1

你做得對。問題在別處,大概是你爲某些文件聲明裝載器的方式。 –

回答

0

嘗試使用巴貝爾變換運行包:babel-plugin-transform-runtime

npm install --save-dev babel-plugin-transform-runtime 

.bablerc位於項目的根

{ 
    "presets": ["es2015", "stage-2"], 
    "plugins": ["transform-runtime"] 
} 

你現在可以重置entry PARAM:

entry: { 
    app: './src/main.js' 
},