This time I will bring you what are the new features of vue-cli 3.0.x after upgrading to webpack4, what are the precautions after vue-cli 3.0.x is upgraded to webpack4, the following is the actual combat Let’s take a look at the case.
The project is being optimized recently. I took a look at the use of vue-cli3.0.x when I had time. It feels pretty good. Because the previous project used vue-cli 2 Created, forcing us to use eslint makes us uncomfortable. Some "build" and "config" that have nothing to do with the project make people feel uncomfortable. . Since there are many corporate environments, the configuration of the test environment is required. Added ""tt": "node build/tt-build.js"". to 3.0.x How should it be used? It feels much better to look at 3.0.x with these issues in mind.1. Official website information
When learning technology, always check the information on the official website. Because the information there is updated the fastest.vue-cli
vue-cli documentation
2. InstallationEnvironment
Here, I recommend you to use npm install -g @vue/cli. Through yarn global add @vue/cli, you need to make other settings and generate some files.Delete for a few minutes.
npm install -g @vue/cli # or yarn global add @vue/cli # 使用vue命令,创建项目(不同于cli2.0的init,create) vue create my-project
yarn // 安装项目依赖 cd packages/@vue/cli // 目录 yarn link //添加 link `vue` 执行指命 。 vue create my-project // 创建项目 。
3. Multi-environment configuration
Because the company has a development environment, a testing environment, a joint debugging environment, and an online environment. Reduce manual configuration and configure it once. So "package.json" was added in 2.0.x "tt": "node build/tt-build.js"" type configuration cannot configure many files. It is supported in vue-cli 3.0.x ".env" file configuration, I added ".env.development", ".env.production" and ".env.test" configuration here . 1. Basic correspondence and defaultdevelopment is used by vue-cli-service serve production is used by vue-cli-service build test is used by vue-cli-service test
"dev-build": "vue-cli-service build --mode development",
Configuration fileWriting
The configuration file content format is as follows,VUE_APP_*
VUE_APP_MOCK_URL = 'https://xxx.xxx.xxx/restapi/'
console.log(process.env.VUE_APP_MOCK_URL); process.env.NODE_ENV // 特定 BASE_URL // vue.config.js 配置
How to request local json data in vue configuration
pandas dataframe implements row selection and slicing operations
Selenium cookie skips the verification code login implementation step-by-step explanation
The above is the detailed content of What are the new features after upgrading vue-cli 3.0.x to webpack4?. For more information, please follow other related articles on the PHP Chinese website!