一、使用cloudstudio建立vue開發(fā)環(huán)境

1.配置服務器

直接使用帶nodejs的服務器進行啟動

  • 安裝cnpm
npm install -g cnpm --registry=https://registry.npm.taobao.org
  • 安裝vue
cnpm install -g @vue/cli

2.創(chuàng)建項目

2.1使用npm 創(chuàng)建項目

  • 創(chuàng)建項目
vue create www
  • 啟動項目
cd www
npm run serve

2.2使用vite創(chuàng)建項目

建議使用vite創(chuàng)建項目,因為vite速度非常的快,相當于秒開。
項目創(chuàng)建完之后預覽調試可以直接使用。不需要配置其他的選項。

3.預覽調試

  • 配置預覽調試文件.vscode/preview.yml
# .vscode/preview.yml
autoOpen: false # 打開工作空間時是否自動開啟所有應用的預覽
apps:
  - port: 8081 # 應用的端口
    run: npm run serve  # 應用的啟動命令
    root: ./www # 應用的啟動目錄
    name: my-second-app # 應用名稱
    description: 我的第一個 App。 # 應用描述
  • 配置外網訪問權限
    新建一個vue.config.js,添加一下內容。
module.exports = {
    devServer: {
      disableHostCheck: true
    }
  }

4. 啟動預覽窗口

ctrl+shift+p,輸入preview。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

友情鏈接更多精彩內容