vue安裝 element-ui


// 1.安裝 @vue/cli-init
npm i -g @vue/cli-init
// 2. 創建vue項目
vue init webpack app2
// 3.安裝element-ui
npm i elmentui -S
// 4. 借助 babel-plugin-component,我們可以只引入需要的組件,以達到減小項目體積的目的。安裝 babel-plugin-component
npm install babel-plugin-component -D
// 5.將 .babelrc 修改為
{
  "presets": [["es2015", { "modules": false }]],
  "plugins": [
    [
      "component",
      {
        "libraryName": "element-ui",
        "styleLibraryName": "theme-chalk"
      }
    ]
  ]
}
// 6.安裝es支持
npm install babel-preset-es2015 --save-dev

// 7.安裝syntax-dynamic-import 插件
npm install babel-plugin-syntax-dynamic-import --save-dev

// 8.修改 webpack.base.conf.js 文件

   {
     test: /\.js$/,
     loader: 'babel-loader',
     options:{
          plugins:['syntax-dynamic-import']
     },
     include: [resolve('src'), resolve('test'), resolve('node_modules/webpack-dev-server/client')]
   },


// 9. 在main.js引用

   import {Message} from 'element-ui'
   import 'element-ui/lib/theme-chalk/index.css'
   Vue.use(Message);








 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM