First screen loading optimization after vuejs project packaging and problems that occur after packaging

This article mainly introduces the optimization of the first screen loading after the vuejs project is packaged and the problems that may occur after packaging. Friends in need can refer to the following

1: Using CDN resources

When we package, we will package the plug-ins in the dependencies object in package.json. We can load some of them using cdn. For example, we do not want to load vue, axios, vuex , vue-router is packaged into our project, we need this:

1: Open webpack.base.conf.js

module.exports = {
   externals: {
    ‘vue‘: ‘Vue‘,
    ‘axios‘: ‘axios‘,
    ‘vuex‘: ‘Vuex‘,
    ‘vue-router‘: ‘VueRouter‘
 }
}

2: Open router/index.js. Log out the following two lines

//import Vue from ‘vue‘
//Vue.use(Router)

3: If you use vuex, log out Vue.use(Vuex) in vuex/index.js (named differently)

Vue.use(Vuex)

##Possible problems after packaging

1: Elements surrounded by keep-alive cannot Reason for displaying

: Unknown.

Solution: No need to keep-alive

Recommended reading: Vue project uses CDN to optimize the first screen loading problem

The above is what I compiled for everyone, I hope it will be helpful to everyone in the future helpful.

Related articles:

Comparison between javascript and PHP dynamically adding methods to classes

vue2 mint-ui loadmore implements pull-down refresh, up Pull more functions

JS code to implement computer configuration detection function

The above is the detailed content of First screen loading optimization after vuejs project packaging and problems that occur after packaging. For more information, please follow other related articles on the PHP Chinese website!