<span id="mktg5"></span>

<i id="mktg5"><meter id="mktg5"></meter></i>

        <label id="mktg5"><meter id="mktg5"></meter></label>
        最新文章專題視頻專題問答1問答10問答100問答1000問答2000關(guān)鍵字專題1關(guān)鍵字專題50關(guān)鍵字專題500關(guān)鍵字專題1500TAG最新視頻文章推薦1 推薦3 推薦5 推薦7 推薦9 推薦11 推薦13 推薦15 推薦17 推薦19 推薦21 推薦23 推薦25 推薦27 推薦29 推薦31 推薦33 推薦35 推薦37視頻文章20視頻文章30視頻文章40視頻文章50視頻文章60 視頻文章70視頻文章80視頻文章90視頻文章100視頻文章120視頻文章140 視頻2關(guān)鍵字專題關(guān)鍵字專題tag2tag3文章專題文章專題2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章專題3
        問答文章1 問答文章501 問答文章1001 問答文章1501 問答文章2001 問答文章2501 問答文章3001 問答文章3501 問答文章4001 問答文章4501 問答文章5001 問答文章5501 問答文章6001 問答文章6501 問答文章7001 問答文章7501 問答文章8001 問答文章8501 問答文章9001 問答文章9501
        當(dāng)前位置: 首頁(yè) - 科技 - 知識(shí)百科 - 正文

        如何使用淘寶鏡像cnpm安裝Vue.js

        來(lái)源:懂視網(wǎng) 責(zé)編:小采 時(shí)間:2020-11-27 19:44:40
        文檔

        如何使用淘寶鏡像cnpm安裝Vue.js

        如何使用淘寶鏡像cnpm安裝Vue.js:這次給大家?guī)?lái)如何使用淘寶鏡像cnpm安裝Vue.js,使用淘寶鏡像cnpm安裝Vue.js的注意事項(xiàng)有哪些,下面就是實(shí)戰(zhàn)案例,一起來(lái)看一下。前言Vue.js是前端一個(gè)比較火的MVVM框架,要使用它,我們必須提前配置,其中有一種安裝方式是使用npm,比較適合比較大型的應(yīng)
        推薦度:
        導(dǎo)讀如何使用淘寶鏡像cnpm安裝Vue.js:這次給大家?guī)?lái)如何使用淘寶鏡像cnpm安裝Vue.js,使用淘寶鏡像cnpm安裝Vue.js的注意事項(xiàng)有哪些,下面就是實(shí)戰(zhàn)案例,一起來(lái)看一下。前言Vue.js是前端一個(gè)比較火的MVVM框架,要使用它,我們必須提前配置,其中有一種安裝方式是使用npm,比較適合比較大型的應(yīng)
        這次給大家?guī)?lái)如何使用淘寶鏡像cnpm安裝Vue.js,使用淘寶鏡像cnpm安裝Vue.js的注意事項(xiàng)有哪些,下面就是實(shí)戰(zhàn)案例,一起來(lái)看一下。

        前言

        Vue.js是前端一個(gè)比較火的MVVM框架,要使用它,我們必須提前配置,其中有一種安裝方式是使用npm,比較適合比較大型的應(yīng)用。今天就來(lái)看看這種方式如何操作,由于npm是國(guó)外的,使用起來(lái)比較慢,我們這里使用淘寶的cnpm鏡像來(lái)安裝vue.

        步驟

        首先我們需要下載npm,因?yàn)槲乙呀?jīng)提前安裝了node.js,安裝包里面集成了npm,然后我們就可以利用npm命令從獲取淘寶鏡像的cnpm了。

        1.打開命令行窗口,輸入

        npm install -g cnpm --registry=https://registry.npm.taobao.org

        獲取到cnpm以后,我們需要升級(jí)一下,輸入下面的命令

        cnpm install cnpm -g

        因?yàn)榘惭bVue需要npm的版本大于3.0.0,所以我們要升級(jí)一下,

        然后我們輸入下面的命令,安裝vue

        cnpm install vue

        接下來(lái)安裝vue-cli

        cnpm install --global vue-cli

        此時(shí)環(huán)境就搭建好了。

        2.接下來(lái)我們需要指定一個(gè)目錄存放我們的項(xiàng)目,可以選擇任意路徑,確定好路徑后輸入下面的命令

        vue init webpack "項(xiàng)目名稱"

        3.成功以后,我們進(jìn)入項(xiàng)目所在目錄

        cd "項(xiàng)目所在文件夾"

        然后依次輸入下面的命令

        cnpm install 
        cnpm run dev

        成功后我們進(jìn)入瀏覽器,輸入localhost:8080會(huì)展示下面的頁(yè)面

        項(xiàng)目目錄

        接下來(lái)我們看看上面成功創(chuàng)建的項(xiàng)目,進(jìn)入項(xiàng)目目錄

        我們開發(fā)的目錄是在src,src中包含下面的目錄

        assets:存放突變

        components:存放一個(gè)組件文件

        App.vue:項(xiàng)目入口文件,我們也可以直接將組建寫這里,而不使用 components 目錄

        main.js:項(xiàng)目核心文件

        我們看看App.vue的內(nèi)容

        <template>
         <p id="app">
         <img src="./assets/logo.png">
         <router-view></router-view>
         </p>
        </template>
        <script>
        export default {
         name: 'app'
        }
        </script>
        <style>
        #app {
         font-family: 'Avenir', Helvetica, Arial, sans-serif;
         -webkit-font-smoothing: antialiased;
         -moz-osx-font-smoothing: grayscale;
         text-align: center;
         color: #2c3e50;
         margin-top: 60px;
        }
        </style>

        Hello.vue

        <template>
         <p class="hello">
         <h1>{{ msg }}</h1>
         <h2>Essential Links</h2>
         <ul>
         <li><a href="https://vuejs.org" rel="external nofollow" target="_blank">Core Docs</a></li>
         <li><a href="https://forum.vuejs.org" rel="external nofollow" target="_blank">Forum</a></li>
         <li><a href="https://gitter.im/vuejs/vue" rel="external nofollow" target="_blank">Gitter Chat</a></li>
         <li><a href="https://twitter.com/vuejs" rel="external nofollow" target="_blank">Twitter</a></li>
         <br>
         <li><a href="http://vuejs-templates.github.io/webpack/" rel="external nofollow" target="_blank">Docs for This Template</a></li>
         </ul>
         <h2>Ecosystem</h2>
         <ul>
         <li><a href="http://router.vuejs.org/" rel="external nofollow" target="_blank">vue-router</a></li>
         <li><a href="http://vuex.vuejs.org/" rel="external nofollow" target="_blank">vuex</a></li>
         <li><a href="http://vue-loader.vuejs.org/" rel="external nofollow" target="_blank">vue-loader</a></li>
         <li><a href="https://github.com/vuejs/awesome-vue" rel="external nofollow" target="_blank">awesome-vue</a></li>
         </ul>
         </p>
        </template>
        <script>
        export default {
         name: 'hello',
         data () {
         return {
         msg: 'Welcome to 菜鳥教程'
         }
         }
        }
        </script>
        <!-- Add "scoped" attribute to limit CSS to this component only -->
        <style scoped>
        h1, h2 {
         font-weight: normal;
        }
        ul {
         list-style-type: none;
         padding: 0;
        }
        li {
         display: inline-block;
         margin: 0 10px;
        }
        a {
         color: #42b983;
        }
        </style>

        相信看了本文案例你已經(jīng)掌握了方法,更多精彩請(qǐng)關(guān)注Gxl網(wǎng)其它相關(guān)文章!

        推薦閱讀:

        怎樣使用ES6模版字符串

        如何使用npm安裝全局模塊權(quán)限

        聲明:本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí),若有侵權(quán)等問題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系,我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

        文檔

        如何使用淘寶鏡像cnpm安裝Vue.js

        如何使用淘寶鏡像cnpm安裝Vue.js:這次給大家?guī)?lái)如何使用淘寶鏡像cnpm安裝Vue.js,使用淘寶鏡像cnpm安裝Vue.js的注意事項(xiàng)有哪些,下面就是實(shí)戰(zhàn)案例,一起來(lái)看一下。前言Vue.js是前端一個(gè)比較火的MVVM框架,要使用它,我們必須提前配置,其中有一種安裝方式是使用npm,比較適合比較大型的應(yīng)
        推薦度:
        標(biāo)簽: 如何 js vue.js
        • 熱門焦點(diǎn)

        最新推薦

        猜你喜歡

        熱門推薦

        專題
        Top
        主站蜘蛛池模板: 亚洲av永久无码精品三区在线4 | 免费网站看v片在线香蕉| 久久久久亚洲Av片无码v| GOGOGO免费观看国语| 中文字幕亚洲综合久久菠萝蜜| 国产亚洲精品AAAA片APP| 国产精品公开免费视频| 亚洲aⅴ天堂av天堂无码麻豆| 免费涩涩在线视频网| 久久精品国产亚洲AV未满十八| 国产传媒在线观看视频免费观看| 美女又黄又免费的视频| 亚洲国产精品无码久久青草 | 亚洲日韩国产一区二区三区在线| 美女视频黄的全免费视频| 色在线亚洲视频www| 青青青青青青久久久免费观看 | 国产亚洲AV手机在线观看| 中文字幕视频免费在线观看| 亚洲精品你懂的在线观看| 99re免费99re在线视频手机版| 亚洲黄色三级视频| 成年人网站在线免费观看| 337P日本欧洲亚洲大胆精品| 亚洲午夜成人精品电影在线观看| 国产一级a毛一级a看免费视频| 666精品国产精品亚洲 | 麻豆视频免费播放| 亚洲日韩看片无码电影| 亚洲国产香蕉人人爽成AV片久久 | 亚洲AV无码乱码国产麻豆| 91热久久免费精品99| 亚洲精华国产精华精华液网站| 亚洲精品国精品久久99热| 久久精品电影免费动漫| 亚洲人成网国产最新在线| 亚洲伊人久久成综合人影院| 91久久青青草原线免费| 国产亚洲综合精品一区二区三区| 亚洲国产精品无码久久一线| 中文字幕无码成人免费视频|