vue-cli是怎麼通過webpack把js檔案引入index.html的過程呢?
vue新手在用vue-cli寫專案時候會發現,專案目錄下index.html並沒有通過標籤引入任何js。index.html如下:
那到底是怎麼引入js的呢?首先開啟package.json,找到script
meta
charsets="utf-8">
meta
name='viewport'
content='width=device-width,user-scalable=no,scalable=1.0'>
div>
html>
"scripts": ,
執行命令npm run dev ,這時你會看到你建立的vue專案啟動起來,所以我們一步步看,執行這個命令,需要找到webpack.dev.conf.js」這個檔案,開啟它
我們看到
它引入了很多外掛程式,這裡我們不管其他的,只看兩個,webpack.base.conf ;html-webpack-plugin'use strict'
const utils = require('./utils')
const webpack = require('webpack')
const config = require('../config')
const merge = require('webpack-merge')
const basewebpackconfig = require('./webpack.base.conf')
const htmlwebpackplugin = require('html-webpack-plugin')
const friendlyerrorsplugin = require('friendly-errors-webpack-plugin')
const portfinder = require('portfinder')
開啟webpack.base.conf.js,我們看到
入口檔案指向main.js,開啟main.js,如下'use strict'
const path = require('path')
const utils = require('./utils')
const config = require('../config')
const vueloaderconfig = require('./vue-loader.conf')
function
resolve
(dir)
module.exports = ,
import vue from
'vue'
import router from
'./router'
import elementui from
'element-ui'
import
'element-ui/lib/theme-chalk/index.css'
import store from
"./store"
import echarts from
'echarts'
vue.config.productiontip = false
vue.prototype.$echarts = echarts
vue.use(elementui)
/* eslint-disable no-new */
new vue()
function
htmlwebpackplugin
(options) {
// default options
this.options = _.extend({
template: path.join(__dirname, 'default_index.ejs'),
filename: 'index.html',
hash: false,
Vue 如何在vue cli中建立並引入自定義元件
vue cli中的所有元件都是存放在components資料夾下面的,所以在components資料夾下面建立乙個名為first.vue的自定義元件 template div h1 h1 div template script 1 export 表示匯出,在自定義元件裡面使用export defau...
js中的GO和AO是怎樣產生的
1 建立乙個ao物件 activation object ao 2 將函式內所有的形參和變數宣告 的名 儲存到ao物件中,value為undifined ao3 將形參和實參進行統一。ao4 將所有的函式宣告的函式名作為ao物件中的key,函式整體內容為value儲存到ao物件中 ao,b 3,c ...
JSP頁面中引入js檔案
1 引入的js檔案出錯,檢查方法 將js的內容寫在當前的頁面的之間,看是否能夠正常執行,如果不能,請核查 2 如果引入的 在當前頁面中能夠正常執行,但當引入時不能正常執行,則有兩種可能 a 引入js的路徑有問題 b 引入的js的編碼格式與當前頁面不匹配 3 引入js的路徑問題 js的引入不外乎兩種,...