Zengtudor/Nuxt
1
0
Fork 0
mirror of https://github.com/nuxt/nuxt.git synced 2024-11-23 14:15:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

process.BROWSER_BUILD

Browse Source
This commit is contained in:
Sébastien Chopin 2016-11-24 01:46:20 +01:00
parent d203d48c05
commit e441b7eb12
5 changed files with 13 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
examples/plugins-vendor/README.md
View File

@ -50,18 +50,22 @@ I added `vue-notifications` in the `vendor` key to make sure that it won't be in
### Only in browser build ### Only in browser build
Some plugins might work only in the browser, for this, you can use the `process.BROWSER` variable to check if the plugin will run from the server or from the client. Some plugins might work only in the browser, for this, you can use the `process.BROWSER_BUILD` variable to check if the plugin will run from the server or from the client.
Example: Example:
```js ```js
import Vue from 'vue' import Vue from 'vue'
import VueNotifications from 'vue-notifications' import VueNotifications from 'vue-notifications'
if (process.BROWSER) { if (process.BROWSER_BUILD) {
Vue.use(VueNotifications) Vue.use(VueNotifications)
} }
``` ```
### Only in server build
In case you need to require some libraries only for the server, you can use the `process.SERVER_BUILD` variable set to `true` when webpack is creating the `server.bundle.js` file.
## Demo ## Demo
```bash ```bash

4
examples/plugins-vendor/pages/index.vue
View File

@ -7,15 +7,13 @@
<script> <script>
let miniToastr let miniToastr
if (process.BROWSER) { if (process.BROWSER_BUILD) {
miniToastr = require('mini-toastr') miniToastr = require('mini-toastr')
} }
export default { export default {
mounted () { mounted () {
if (process.BROWSER) {
miniToastr.init() miniToastr.init()
}
}, },
notifications: { notifications: {
showLoginError: { showLoginError: {

2
examples/plugins-vendor/plugins/vue-notifications.js
View File

@ -2,7 +2,7 @@
import Vue from 'vue' import Vue from 'vue'
import VueNotifications from 'vue-notifications' import VueNotifications from 'vue-notifications'
if (process.BROWSER) { if (process.BROWSER_BUILD) {
// Include mini-toaster (or any other UI-notification library // Include mini-toaster (or any other UI-notification library
const miniToastr = require('mini-toastr') const miniToastr = require('mini-toastr')

3
lib/build/webpack/client.config.js
View File

@ -36,7 +36,8 @@ module.exports = function () {
// strip comments in Vue code // strip comments in Vue code
new webpack.DefinePlugin({ new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify(this.dev ? 'development' : 'production'), 'process.env.NODE_ENV': JSON.stringify(this.dev ? 'development' : 'production'),
'process.BROWSER': true 'process.BROWSER_BUILD': true,
'process.SERVER_BUILD': false
}), }),
// Extract vendor chunks for better caching // Extract vendor chunks for better caching
new webpack.optimize.CommonsChunkPlugin({ new webpack.optimize.CommonsChunkPlugin({

4
lib/build/webpack/server.config.js
View File

@ -26,8 +26,8 @@ module.exports = function () {
plugins: (config.plugins || []).concat([ plugins: (config.plugins || []).concat([
new webpack.DefinePlugin({ new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify(this.dev ? 'development' : 'production'), 'process.env.NODE_ENV': JSON.stringify(this.dev ? 'development' : 'production'),
'process.env.VUE_ENV': '"server"', 'process.BROWSER_BUILD': false,
'process.BROWSER': false 'process.SERVER_BUILD': true
}) })
]) ])
}) })