問題一:?在瀏覽器上的擴展程序上添加了vue-devtools后不生效:
解決方式:打開剛加入的擴展工具Vue.js devtools的允許訪問文件地址設(shè)置
問題二:Vue新建一個項目
創(chuàng)建一個空文件夾hrsone,然后在VSCode中打開這個空文件夾
?打開端口新建終端:按順序輸入以下命令
1、全局安裝vue-cli,vue-cli可以幫助我們快速構(gòu)建Vue項目
npm install -g vue-cli
?
2、安裝webpack,它是打包js的工具、
npm install -g webpack
?
3、在VS Code菜單:終端-新建終端,并創(chuàng)建項目命令
vue init webpack hrs
接著會出現(xiàn)一些配置項,可以根據(jù)需要配置,也可以默認,直接按回車。
然后繼續(xù)等待安裝依賴項。完成之后,一個基本的 vue項目就搭建完了。完成之后的vscode左邊可以看到如下目錄,
其中main.js就是入口。
4、運行項目
先cd到項目文件夾,cd hrsone,然后輸入以下指令:
npm run dev
然后就開始報錯了
報錯一:
vue : 無法加載文件 D:\vue\node_global\vue.ps1,因為在此系統(tǒng)上禁止運行腳本。有關(guān)詳細信息,請參閱 https:/go.micr osoft.com/fwlink/?LinkID=135170 中的 about_Execution_Policies。 所在位置 行:1 字符: 1
解決方式:
首先在終端中執(zhí)行命令:get-ExecutionPolicy,顯示執(zhí)行策略為:Restricted,表示腳本被禁止。
set-ExecutionPolicy RemoteSigned:設(shè)置執(zhí)行策略為RemoteSigned。
然后我們再執(zhí)行g(shù)et-ExecutionPolicy
顯示RemoteSigned,即表示可以正常執(zhí)行腳本命令了。
?
報錯二:
webpack-dev-server --inline --progress --config build/webpack.dev.conf.js ?'webpack-dev-server' 不是內(nèi)部或外部命令,也不是可運行的程序
解決方式:
先運行 npm install 然后npm run build,最后運行npm run dev后項目成功運行。
報錯三:
Current existing ChromeDriver binary is unavailable, proceding with download and extraction.
解決方式:
安裝下國內(nèi)鏡像:npm install chromedriver --chromedriver_cdnurl=http://cdn.npm.taobao.org/dist/chromedriver
再運行?npm install
?就可以把相關(guān)依賴裝上了
然后在運行 npm run dev 就可以了
成功之后,接著在瀏覽器里輸入:http://localhost:8086,看到如下畫面就是成功了。
ip跟端口地址配置在這個文件里
5、退出運行:在終端按Crtl+C
輸入Y 結(jié)束。
6、項目打包發(fā)布
輸入命令:
npm run build
完成之后,項目文件夾中會出現(xiàn)一個dist文件夾,里面就是打包之后的內(nèi)容,直接部署就好了。
問題三:Use /* eslint-disable */ to ignore all warnings in a file. 報 錯,不注釋掉,啟動運行都報錯
解決方式:
有了eslint的校驗,可以來規(guī)范開發(fā)人員的代碼,是挺好的。但是有些像縮進、空格、空白行之類的規(guī)范,但是稍有不符合,就會在開發(fā)過程中一直報錯,太影響心情和效率了。所以,還是會選擇關(guān)閉eslint校驗。?
路徑:在build/webpack.base.conf.js文件中,注釋或者刪除掉:module->rules中有關(guān)eslint的規(guī)則
文章來源:http://www.zghlxwxcb.cn/news/detail-669617.html
?文章來源地址http://www.zghlxwxcb.cn/news/detail-669617.html
到了這里,關(guān)于Vue初識別--環(huán)境搭建--前置配置過程的文章就介紹完了。如果您還想了解更多內(nèi)容,請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!