vue.js with vue-multilanguage我的webpack編譯器沒有被正確翻譯

我的webpack編譯器沒有被轉譯成正確的JS。它寫道vue.js with vue-multilanguage我的webpack編譯器沒有被正確翻譯

exports default MultiLanguage 而不是 module.exports = { MultiLanguage: MultiLanguage};

我.bablerc

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

我的package.json

{ 
    "name": "myapp", 
    "version": "0.0.1", 
    "description": "My app", 
    "dependencies": { 
    "bootstrap": "^3.3.7", 
    "vue": "^2.4.2", 
    "vue-multilanguage": "^2.1.1" 
    }, 
    "devDependencies": { 
    "babel-cli": "^6.24.1", 
    "babel-core": "^6.25.0", 
    "babel-loader": "^6.4.1", 
    "babel-plugin-transform-runtime": "^6.1.2", 
    "babel-preset-es2015": "^6.24.1", 
    "babel-preset-stage-0": "^6.1.2", 
    "babel-runtime": "^5.8.0", 
    "webpack": "^1.15.0" 
    }, 
    "author": "You" 
}

我webpack.config.js

module.exports = { 
    entry: './src/main.js', 
    output: { 
    path: './dist', 
    filename: 'build.js' 
    }, 
    module: { 
    loaders: [ 
     { 

     test: /\.js$/, 
     loader: 'babel', 
     exclude: /node_modules/ 
     } 
    ] 
    } 
}

及其所用的錯誤，並在那裏打在build.js代碼在Chromium/Chrome的UND Ubuntu的：

Uncaught SyntaxError: Unexpected token export

在Firefox

：

SyntaxError: export declarations may only appear at top level of a module 
    export default MultiLanguage

這裏也vue code（main.js）：

import Vue from 'vue/dist/vue.js' 
import MultiLanguage from 'vue-multilanguage/src/vue-multilanguage.js' 

Vue.use(MultiLanguage, { 
    default: 'en', 
    en: { 
     hi: 'Hello', 
     welcome: 'Welcome, {name}' 
    }, 
    pt: { 
     hi: 'Ola', 
     welcome: 'Bem-vindo, {name}' 
    } 
})

任何推薦的教程？任何想法？

當我更換build.js行機智module.exports = { MultiLanguage: MultiLanguage};誤差不occure

來源

2017-07-30 helle

我從來沒有使用過之前使用的元素屬性語法。這可能會導致你的錯誤。你檢查過控制檯嗎？我可以打賭，由於v.lang.welcome屬性，vue在渲染模板時遇到問題。我不認爲這是正確的HTML5。 –

我必須承認。我從模塊的教程 – helle

複製它我建議尋找另一個教程，因爲你使用的語法看起來不像我見過的任何東西。 –

您的問題是鏈接到你的導入。

vue-multilanguage.js未被其作者預先編譯（這很少見，通常庫包含一個dist文件，可以使用......），並且它在您的node_modules文件夾中，它不會從ES6轉換爲ES5由你的寶貝裝載機也是如此。您需要在您的webpack.config.js中添加例外。

module.exports = { 
    entry: './src/main.js', 
    output: { 
    path: './dist', 
    filename: 'build.js' 
    }, 
    module: { 
    loaders: [ 
     { 

     test: /\.js$/, 
     loader: 'babel-loader', 
     // exclude everything from node_modules, except vue-multilanguage 
     exclude: /node_modules(?![\\/]vue-multilanguage[\\/])/ 
     } 
    ] 
    } 
}

沒有直接關係，但不是說我也'babel-loader'取代'babel'，以避免與舊包了一些錯誤。 See here。

此外，您可以（也可能應該），如評論中所述，通過這種方式導入vue。

import Vue from 'vue';

旁註：

根據他們package.json，有應該準備在他們的庫中使用文件，位於dist/vue-multilanguage.js。但他們奇怪地將他們的dist文件夾添加到他們的.npmignore文件中，所以它不包括在內。這可能是一個錯誤。我會在他們的github上發佈一個問題。一旦它的糾正，如果你更新你的包，你應該能夠簡單地進口VUE的多是這樣的（不添加任何例外，你的WebPack配置）：

import MultiLanguage from 'vue-multilanguage'

來源

2017-08-02 08:09:30 Cobaltway

感謝您的答覆。沒有路徑我不能導入vue。爲什麼？我更改了exlude部分，並且在build.js中仍然有簡單的ES6導出。任何想法，你需要任何信息？ – helle

當我再次替換該行時，我收到了另一個錯誤：build.js：619 [Vue warn]：無法解析指令：lang – helle

我在github上託管了一個最小工作版本，查看是否與您有任何區別：https ：//github.com/cobaltway/vue-multiintegration – Cobaltway

我會用未來進口：

import Vue from './vue'; 
import MultiLanguage from './vue-multilanguage';

來源

2017-08-02 23:28:59 sancelot

vue.js with vue-multilanguage我的webpack編譯器沒有被正確翻譯

回答

相關問題